Vue指令v-for之遍历输出JavaScript数组,json对象的几种方式
定义数据:
<script>
new Vue({
el:"#test",
data:{
message:"infor",
list:["a","b","c","d","e"],
web:{
"百度":"https://www.baidu.com",
"搜狐":"https://www.sohu.com",
"新浪":"https://www.sina.com",
"淘宝":"https://www.taobao.com"
}
}
})
</script>
html结构:
<div id="test">
<div>{{ message }}</div>
<div>{{ list }}</div>
<div>{{ web }}</div>
</div>
v-for对数组的几种输出方式:
1.只输出value值
html代码:
<div id="test">
<div v-for = "item in list">{{ item }}</div>
</div>输出结果:
2.输出value值且输出对应的索引值
html代码:
<div id="test">
<div v-for = "(item,index) in list">{{ item }}的索引值是{{ index }}</div>
</div>
v-for对json格式的几种输出方式
1.只输出value值
html代码:
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。
- 上一篇: java 分批读取list
- 下一篇: 体验js中splice()的强大(插入、删除或替换数组的元素)
copyright © 2008-2019 亿联网络 版权所有 备案号:粤ICP备14031511号-2
