iview中 form+table 渲染的问题????

描述

需求

在表格里面渲染form表单,数字保留2位小数,不足的自动补齐。

选用

选用的是 iview 的组件 Form 、Input、Table。

Form表单的数据可以双向绑定,这样在对输入的数据做补零操作后,更新Form表单的model绑定的数据,即可更新。

没有使用 InputNumber 是因为它的交互用户体验不是很友好,而选用了常用的Input。
但问题不是出在这里,请继续往下看。

form+table

test.vue


form-item-input.vue


图示

问题

使用 this.$set(this.$data.formTable, _formKey, '') 处理数据可以实现数据的双向绑定。
但是会导致表格渲染两次。

解决

怎么解决呢????

注意

此处的Form表单和表格的样式等需要调整细节,不在本次的重点,可以忽略。

你可能感兴趣的:(vue.js,iview,form,table,双向绑定)