在html5页面中,我们知道设置元素样式的方法有2种:一种是直接在元素标签中添加style属性并设置样式,另一种是给元素添加class属性然后给class属性设置样式。既然原生的html页面有这两种设置属性的方式,那么iview的render函数当然也可以这么给元素添加样式啦。
render函数添加样式的两种方法:
第一种方法:直接设置style属性
“操作”列的render函数如下代码:
{
title: '操作',
align: 'center',
render: (h, params) => {
return h('div', [
h('span', {
style:{
fontSize: '14px',
padding: '5px 10px',
cursor: 'pointer',
color: '#fc1'
}
}, '查看'),
]);
}
}
第二种方法:给元素设置class属性
如果我想在鼠标移动到 “查看” 时改变字体的颜色,那么就可以在.show后面加伪类,而第一种方法就做不到了,实现如下:
注意:这里的style是不加作用域scoped的,如果加了class样式就不生效了
原文链接:https://blog.csdn.net/fanyanjiang/article/details/103616662