1、iview+vue中,对表头的动态设置:
iview表头若是需要动态设置,可以有两个方法,第一种:
children: [ { title: '2017年', align: 'center', key: 'firstYear', renderHeader: (h, index) => { return h('div', { domProps: { innerHTML: this.data5.lastYear + '年' } }); } }, {
利用renderheader属性来设置表头。iview中的table自定义列头显示内容,使用 Vue 的 Render 函数。传入两个参数,第一个是 h,第二个为对象,包含 column
和 index
,分别为当前列数据和当前列索引。还有一种方式是在直接调用title更改:
this.columns4[2].children[0].title = this.timeYear.lastYear;
但是这种方式可能会引起Vue的update无限循环警告。建议使用第一种方法。
2、iview+vue中,表单验证select出错:
可能在使用iview表单的select时,发现代码没有书写错误,但是验证功能出现问题,这是因为iview默认类型与最终select的需要验证的结果类型不一致。
3、iview+vue中,radio选择问题:
在iview的单选radio中,绑定选中状态lable = “0”与获取选中状态status = 0 是不匹配的,应为“0”。
结论:在iview使用过程中,要注意默认类型问题,很容易出现接收类型与默认类型不一致的情况而导致出现错误。对与表格自定义列的问题,render自定义列内容,renderheader自定义列头。