zoukankan      html  css  js  c++  java
  • iview,用render函数渲染

    <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: {
                                         '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: {
                                             '100px'
                                        },
                                        on: {
                                            'on-blur': (event) => {
                                                this.discountData.rows[params.index].randomDiscountRangeMax = event.target.value
                                            }
                                        }
                                    }),
                                    h('span', '元')])
                            }
                        },
                        {
                            key: 'population',
                            align: 'center',
                            title: '概率',
                             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: {
                                         '100px'
                                    },
                                    on: {
                                        'on-blur': (event) => {
                                            this.discountData.rows[params.index].population = event.target.value
                                        }
                                    }
                                }), h('span', '%')])
                            }
                        }, {
                            key: 'operation',
                            align: 'center',
                            title: '操作',
                             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)
               }  
    

     

  • 相关阅读:
    树剖
    codeforces round 589
    codeforces round 590
    code craft 20
    Ozon Tech Challenge 2020 (Div.1 + Div.2)
    codeforces round 625
    Crime HDU
    codeforces 594
    codeforces 596
    python操作mysql方法和常见问题
  • 原文地址:https://www.cnblogs.com/itrena/p/8830951.html
Copyright © 2011-2022 走看看