一、需求
一个页面显示多个列表数据,需要改变表头columns参数等
二、问题
1、设置columns之后,因为a-table中的columns、data-source是响应式的,所以可以看到切换渲染是可以正常完成的,数据、表头都是正常的。
2、由于列表数据除了直接取过来显示的之外,还有部分数据需要根据值进行判断显示对应的状态,在动态改变columns值后发现在a-table标签内所定义的slot不起作用了。
3、由于切换时渲染的表头文字等显示是正常的,所以排除渲染问题;在data中改变columns的初始赋值,发现可能跟初始赋值有关。
三、解决办法
1、在a-table中除了在标签内自定义slot来改变数据的内容显示外,还可以使用customRender改变相关值得显示。
2、如果使用customRender进行格式列表数据,最好在methods中新写一个方法进行对应的columns赋值,或者直接在切换中定义(主要是为了保证customRender使用到的数据、方法已经进行定义)
ps:如果存在点击事件,或者需要使用标签;需要使用jsx语法,例如
标签:Vue,使用,表头,Ant,Design,customRender,table,数据,columns From: https://www.cnblogs.com/shlbetter/p/18609638