iview的table push一列以后获取不到值

Question

data：

data: [],
newData: {
        occurrenceTime: "",
        type: "",
        occurrenceAmount: ""
    },

columns:

[
    {
                        title: "发生日期",
                        align: "center",
                        key: "occurrenceTime",
                        render: (h, params) => {
                            return h('DatePicker', {
                                props: {
                                    clearable: false,
                                    placeholder: '请选择日期',
                                    transfer: true,
                                    value: this.newData.occurrenceTime,
                                    type: 'date',
                                    format: 'yyyy-MM-dd'
                                },
                            })
                        }
                    },
                    {
                        title: "发生类型",
                        align: "center",
                        key: "type",
                        render: (h, params) => {
                            return h('Select', {
                                    props: {
                                        transfer: true,
                                        value: this.newData.type,
                                    },
                                },
                                [
                                    h('Option', {
                                        props: {
                                            value: '1'
                                        }
                                    }, '借款'),
                                    h('Option', {
                                        props: {
                                            value: '2'
                                        }
                                    }, '还款')
                                ]
                            );
                        }
                    },
                    {
                        title: "发生金额",
                        align: "center",
                        key: "occurrenceAmount",
                        render: (h, params) => {
                            return h('Input', {
                                props: {
                                    value: this.newData.occurrenceAmount,
                                },
                            }, );
                        }
                    },
                
]

事件：

            add() {
                this.data.push({
                    occurrenceTime: "",
                    type: "",
                    occurrenceAmount: ""
                })
            },

新增了一行，然后输入值

点计算导出

打印出来 this.data 还是push的时候的空值

该怎么解决

Answer 1

我推测你空白行里面应该有三个input输入框吧，你应该定义一个对象，有三个属性：occurrenceTime、type、occurrenceAmount，然后分别与三个输入框进行绑定。

<Input v-model="newLineObject.occurrenceTime" placeholder="default size" />
<Input v-model="newLineObject.type" placeholder="default size" />
<Input v-model="newLineObject.occurrenceAmount" placeholder="default size" />

---

data() {
    return {
        newLineObject: {
            occurrenceTime: "",
            type: "",
            occurrenceAmount: ""
        },
        data: []
    }
},
methods: {
    add() {
        this.data.push(this.newLineObject);
    }
}

Answer 2

1.?? 你的 add 绑定在哪里 ? 是按钮事件吗?
2.然后不要在 data 里面命名 data，反正我没试过 ...
3.元素没有双向绑定啊, 也没有 change 事件更新数据

const self = this;
h('Input', {
    props: {
        value: self.newData.occurrenceAmount,
    },
    on: {
        input: self.handlerChange
    }
})