vue如何实现将字符串解析成绑定数据

Question

请问一下，我用v-for循环了一个描述列表，但是list.content内部的数据需要与jc_name相同，我试过的{{foodArr.jc_name}}循环完是字符串，怎样实现传值并数据解析

<el-descriptions class="margin-top" title="等位信息" :column="3" :size="size" border>
    <el-descriptions-item v-for="(list, x) in lists" :key="x">
          <template slot="label">
                <i :class="list.class"></i>
                      {{list.title}}
           </template>
                 {{list.content}}
     </el-descriptions-item>
</el-descriptions>

```javascript
data(){
        return{
            foodArr:{
                jc_name:'',
            },
            lists: [
                {
                    class:"el-icon-office-building",
                    title:"客人姓名",
                   **content : '{{foodArr.jc_name}}'**,
                },
            ],
        }    
    },

```

Answer 1

哈喽，可以把用foodArr的key作为content，然后再渲染的时候以foodArr[key值]进行获取

<el-descriptions class="margin-top" title="等位信息" :column="3" :size="size" border>
    <el-descriptions-item v-for="(list, x) in lists" :key="x">
          <template slot="label">
                <i :class="list.class"></i>
                      {{list.title}}
           </template>
                 {{foodArr[list.content]}}
     </el-descriptions-item>
</el-descriptions>

data(){
        return{
            foodArr:{
                jc_name:'',
            },
            lists: [
                {
                    class:"el-icon-office-building",
                    title:"客人姓名",
                    content : 'jc_name',
                },
            ],
        }    
    },