鍍金池/ 問答/HTML/ iView中Table通過render添加一個Input如何雙向綁定數(shù)據(jù)

iView中Table通過render添加一個Input如何雙向綁定數(shù)據(jù)

有一個Table:

<Table :columns="columns" :data="data" :border="true"></Table>

JS代碼如下:

 export default {
        data(){
            return {
                columns:[],
                data:[{name:11111,name2:'加工精度',value:'',key:''}]
            }
        },
        created(){
            this.init();
        },
        methods:{
            init(){
                let vm = this;
                this.columns = [
                    {
                        title: '序號',
                        key: 'name'
                    },
                    {
                        title: '檢驗項名稱',
                        key: 'name2'
                    },
                    {
                        title: '檢驗值',
                        key:'value',
                        render: (h, params) => {
                            return h('Input',{
                                props:{
                                    type:'text',
                                    value:vm.data[params.index].value //此處如何讓數(shù)據(jù)雙向綁定
                                },
                                on:{
                                    'on-change':(event) => {
                                        console.log(params)
                                    }
                                }
                            })
                        }
                    },
                    {
                        title: '檢驗結(jié)論',
                        key:'key',
                        render: (h, params) => {
                            return h('Select',[
                                h('Option', {
                                    props: {
                                        value: '1',
                                    }
                                }, '合格'),
                                h('Option', {
                                    props: {
                                        value: '2',
                                    }
                                }, '不合格')
                            ]);
                        }
                    },
                ]
            },
            get(){
                console.log(this.data)
            }
        }
    }
回答
編輯回答
心夠野

value:vm.data[params.index].value
并沒有實現(xiàn)雙向綁定呢?
我是這樣寫的,大神幫忙看一下。
{

        title: '數(shù)量',
        key: 'numLots',
        width: 100,
        align: 'center',
        render: (h, params) => {
          return h('div', [
            h('Input', {
              props: {
              value:this.data[params.index].numLots,
              },
            },)
          ]);
        }
      },
2017年4月17日 06:23
編輯回答
笨尐豬
render: (h, params) => {
                            return h('Input',{
                                props:{
                                    type:'text',
                                    value:vm.data[params.index].value
                                },
                                on:{
                                    'on-blur':(event) => {
                                        vm.data[params.index].value = event.target.value;
                                    }
                                },
                            })
                        }

通過這個方法可以解決

2018年2月13日 08:16