javascript - vue.js中怎么渲染多层嵌套的json数据
本文介绍了javascript - vue.js中怎么渲染多层嵌套的json数据的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
看完vue.js文档没多久, 想用vue.js做一个小的demo,用的豆瓣的api,获取的json数据,有好几层。
js代码
actions: {
// search the music
get_music (context, object) {
axios.get(API.searchMusic + object.name)
.then((response) => {
context.commit('getMusic', response.data.musics)
})
}
}
vue组件
<div>
<img :src="musics.image">
<p>{{ musics.author }}</p>
</div>
图片获取到了,但是不知道怎么获取author下面的name,直接写autho的话会变显示成
[{name: 'XXX'}]
我是应该js上面修改呢, 还是该怎么写
解决方案
既然是数组么,说明author可能不仅一个。那你就循环输出下呗。
<p>
<span v-for="a in musics.author">
{{ a.name }}
</span>
</p>
这篇关于javascript - vue.js中怎么渲染多层嵌套的json数据的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文