vue 表格和表单绑定

Demo需要是 

1.点击表格的每一行，弹出响应的表单

2.表单是动态的。（后期要做自动生成表单功能）

3.表单上填充数据对应这一行

4. 在表单修改后，点击保存能将数据实时反应在表格上。

我的思路： 因为表单后期需要做自动生成，所以这一块单独做一个template， 表格的展示数据和表单数据是双向绑定，为了后期能更好调用，分离数据出来使用了vuex的store来储存数据和各种状态

UI库 用了 Element-Ui...

表格直接使用了组件，注意的是表格上的属性是data, props，row-dblclick，弹出框我用到了组件Dialog，有嵌套表单Dialog.，表单中要注意的属性是 :model="form"  已经各个字段对应的model属性。。

第一次表格加载的适合，需要从store 里调用 数据

mounted : function(){

this. initData()

},

methods: {

initData(){

var len = this. $store. state. datas. length;

var i= 0;

for(; i< len; i++){

this. tableData. push( this. $store. state. datas[ i]);

}

},

}

 Dialog中定义了一个父组件，对应的表单页面中需要定义 props,方便父组件传值，当双击表格某一行时，将id传给vuex从而获取响应的某一行的信息。。

< el-dialog title= "表单1" :visible.sync=" dialogFormVisible" >

< component :dgForm=" msg" :is=" isTmForm" ></ compon