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代码:
声明:该文观点仅代表作者本人,入门客AI创业平台信息发布平台仅提供信息存储空间服务,如有疑问请联系rumenke@qq.com。
- 上一篇:没有了
- 下一篇:没有了
copyright © 2008-2019 入门客AI创业平台 版权所有 备案号:湘ICP备2023012770号