(vue)键值对结构数据展示
效果:
数据结构:
this.formInline.algorithmText = [
{
algorithmParameters: {
参数名1: "111",
参数名2: "121,122",
},
algorithmName: "算法1",
algorithmId: 9,
},
{
algorithmParameters: {
参数名1: "211",
参数名2: "221,222",
},
algorithmName: "算法2",
algorithmId: 11,
},
];
展示:
<div v-for="(ele,index) of formInline.algorithmText" :key="index">
<div>
<el-form-item :label="'设置'+ele.algorithmName+'参数:'"></el-form-item>
</div>
<el-form-item
v-for="(item,index) in Object.keys(ele.algorithmParameters)" //重点
:key="index"
:label="item"
class="descInput"
>
<el-input
v-model="ele.algorithmParameters[item]" //重点
placeholder="请输入"
@change="paramsChange"
/>
</el-form-item>
</div>