vue table 中对象数据的渲染

Question

<el-table
              :data="form.projectSetData"
              style="width: 100%">
              <el-table-column
                prop="columncontent"
                label="栏目内容"
                width="180">
                <template scope="scope">
                    <el-form-item label="融资次轮">
                       <el-col :span="11">
                          <el-input v-model="scope.row.columncontent.rotation"></el-input>
                       </el-col>
                   </el-form-item> 
                   <el-form-item label="融资金额">
                    <el-col :span="11">
                    <el-input v-model="scope.row.columncontent.financingamount"></el-input>
                    </el-col>
                   </el-form-item> 
                   <!-- <el-tag>{{scope.row.columncontent.rotation}}</el-tag> -->
                </template>
              </el-table-column>

            </el-table>


     projectSetData 数据格式：
     projectSetData:[
                  {
                    columnname:"融资需求",
                    columncontent:{
                      rotation:"123",
                      financingamount:""
                    }
                  },
                  {
                    columnname:"项目抢占"     
                  },
                  {
                  columnname:"行业领域"     
                  },
                  {
                  columnname:"基本信息"     
                  }
                ]

我想要把table表格数组里面对象的属性赋给表格里面的input，但是我上面的写法报错了，

请教大神这个应该怎么写呢？

Error in render: "TypeError: Cannot read property 'rotation' of undefined"

Answer 1

在适当的位置加个v-if="scope.row.hasOwnProperty('columncontent')"

Answer 2

相应的属性存在才能实现双向绑定。
在获取projectSetData这组数据之后，对数据做个预处理，补充缺少的属性，确保你要绑定的属性存在。