理想的效果是:
标题一??????????????????内容一
标题二??????????????????内容二
标题三??????????????????内容三
实际上的效果是:
标题一??????????????????this.details.c1
标题二??????????????????this.details.c2
标题三??????????????????this.details.c3
<template>
<div>
<van-cell-group>
<van-cell
v-for="(item, index) in d_list"
:key="index"
:title='item.title'
:value="item.value"/>
</van-cell-group>
</div>
</template>
<script>
export default {
data() {
return {
details: {
c1: '内容一',
c2: '内容二',
c3: '内容三',
},
d_list: [
{
title: '标题一',
value: 'this.details.c1',
}, {
title: '标题二',
value: 'this.details.c2',
}, {
title: '标题三',
value: 'this.details.c3',
}
],
}
},
}
</script>
上面的details{}是从后台传过来的对象,能不能在不改变details{}的情况下,在html中循环输出details{}中的属性值和另外自己定义的title吗
###亲测有效!
<template>
<div>
<van-cell-group>
<van-cell
v-for="(item, index) in d_list"
:key="index"
:title='item.title'
:value="details[item.value]"/>
</van-cell-group>
</div>
</template>
<script>
export default {
data() {
return {
details: {
c1: '内容一',
c2: '内容二',
c3: '内容三',
},
d_list: [
{
title: '标题一',
value: 'c1',
}, {
title: '标题二',
value: 'c2',
}, {
title: '标题三',
value: 'c3',
}
],
}
},
}
</script>
###d_list: [
{
title: '标题一',
value: this.details.c1,
}, {
title: '标题二',
value: this.details.c2,
}, {
title: '标题三',
value: this.details.c3,
}
],
不应该是这样?加''不是变成字符串了;还是我没理解对;
或者你在create 方法里遍历下d_list,把details写进去;
可以引入 lodash
,并使用其 .get
方法(需要把开头的 this.
处理掉);
可以用eval
函数;
有耐心的话,自己解析字符串也是可以的嘛。
但是感觉怪怪的。