iview,用render函數渲染
阿新 • • 發佈:2018-04-14
target val 金額 ret his str splay remove disabled
<Table border :columns="discountColumns" :data="discountData.rows"></Table> discountData: { total: 1, rows: [ { randomDiscountRangeMax: ‘‘, randomDiscountRangeMin: ‘‘, population: ‘‘ }, ], defaultRows: { randomDiscountRangeMax: ‘‘, randomDiscountRangeMin: ‘‘, population: ‘‘ }, } discountColumns: [ { key: ‘randomDiscountRange‘, align: ‘center‘, title: ‘隨機立減範圍‘, render: (h, params) => { var me = this return h(‘div‘, [h(‘Input‘, { props: { type: ‘text‘, value: me.discountData.rows[params.index].randomDiscountRangeMin, disabled: this.getIsDetail(), }, style: { width: ‘100px‘ }, on: { ‘on-blur‘: (event) => { me.discountData.rows[params.index].randomDiscountRangeMin = event.target.value } } }), h(‘span‘, ‘元<=隨機立減金額<‘), h(‘Input‘, { props: { type: ‘text‘, value: me.discountData.rows[params.index].randomDiscountRangeMax, disabled: this.getIsDetail(), }, style: { width: ‘100px‘ }, on: { ‘on-blur‘: (event) => { this.discountData.rows[params.index].randomDiscountRangeMax = event.target.value } } }), h(‘span‘, ‘元‘)]) } }, { key: ‘population‘, align: ‘center‘, title: ‘概率‘, width: 300, render: (h, params) => { var me = this return h(‘div‘, [h(‘Input‘, { props: { type: ‘text‘, value: me.discountData.rows[params.index].population, disabled: this.getIsDetail(), }, style: { width: ‘100px‘ }, on: { ‘on-blur‘: (event) => { this.discountData.rows[params.index].population = event.target.value } } }), h(‘span‘, ‘%‘)]) } }, { key: ‘operation‘, align: ‘center‘, title: ‘操作‘, width: 200, render: (h, params) => { return h(‘div‘, [ h(‘Button‘, { props: { type: ‘primary‘, shape: ‘circle‘, icon: ‘plus‘, disabled: this.getIsDetail(), }, style: { display: params.index !== 0 ? ‘none‘ : ‘inline‘ }, on: { click: () => { this.add(‘discountData‘) } } }), h(‘Button‘, { props: { type: ‘primary‘, shape: ‘circle‘, icon: ‘minus‘, disabled: this.getIsDetail(), }, style: { display: params.index === 0 ? ‘none‘ : ‘inline‘ }, on: { click: () => { this.remove(params.index, ‘discountData‘) } } }) ]) } } ] add (dataName) { var obj = JSON.parse(JSON.stringify(this[dataName].defaultRows)) this[dataName].rows.push(obj) } remove (index, value) { this[value].rows.splice(index, 1) }
iview,用render函數渲染