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参数)
原文地址:https://www.cnblogs.com/wangyan0926/p/14482330.html