iview中Table组件使用render自定义Tag颜色
概述: 我们都知道在Tag组件可以自定义颜色,但会发现使用自定义颜色会导致文字颜色是白色,只有背景色会发生变化。下面是官网给出的例子:
分析: 究其原因是Tag组件的写法内包含了span,这才是我们要修改文字颜色的关键
方案:
{
title: 'xx',
key: 'xx',
render: (h, params) => {
return h('Tag', {
props: {
color: // 这里对应的Tag中的color
},
}, [
h('span', {
style: {
color: // 这里才是设置内部span的字体颜色
}
}, xxx) // Tag显示的内容
]);
}
}
至此,Tag上的文字颜色就可以显示为我们想要的效果了!