zoukankan      html  css  js  c++  java
  • vue项目中使用iview组件中的table插件实现表头文字居中,内容文字居左

    分享一下我在做项目中遇到的项目需求(vue项目中使用iview组件中的table插件实现表头文字居中,内容文字居左)的解决方法

    要实现的效果图:

            

    目标:实现“副本名称”居中,它下面的内容居左

    代码实现:(1)html布局代码

                  

             <Table
                               width="100%"
                               :columns="表头信息"
                               :data="对应的接口数据"
                             ></Table>
         (2)js部分的代码
            1.表头信息部分代码:
                      
                      
                      {
                                title: "副本名称",
                                key: "name",
                                align: "center",
                                render: (h, params) => {
                                   return h('div', {
                                        style: {
                                            textAlign: 'left'
                                        }
                                    }, [
                                        h('span', {
                                              style: {
                                              }
                                        }, params.row.copyName)
                                    ]);
                                 }
                            },
             2.对应接口数据(调取接口,直接将接口里面的data数据赋值给table里面的data参数)
  • 相关阅读:
    微信支付的安全漏洞之XXE
    IP地址分类(A类 B类 C类 D类 E类)
    MySql新增表的字段,删除表字段
    Java基础之中间件的初识
    Java基础之IO框架
    微信H5支付坑一--手续费未结算
    设计模式之简单工厂模式
    nginx负载均衡的5种策略(转载)
    Mybatis注意点之#与$区别
    RSF 分布式 RPC 服务框架的分层设计
  • 原文地址:https://www.cnblogs.com/wangyan0926/p/14482330.html
Copyright © 2011-2022 走看看