Vue中使用v-for遍历对象
Vue中使用v-for遍历对象语法格式( value, key, index )inObjectvalue————值key————键名index————角标<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Title</title><!--
·
语法格式
( value, key, index ) in Object
value ———— 值
key ———— 键名
index ———— 角标
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<!--引入最新的vue稳定版本-->
<script type="text/javascript" src="https://unpkg.com/vue/dist/vue.min.js"></script>
<link rel="stylesheet" href="./css/style.css" type="text/css">
</head>
<body>
<!--使用v-for遍历对象属性-->
<div id="app">
<ul>
<li v-for="(value,key,index) in user"> 角标:{{index}}------ 键名: {{key}} ------ 值:{{value}} </li>
</ul>
</div>
<script>
var vue=new Vue({
el:'#app',
data:{
user:{
name: '张三',
gender: '男',
age: 30,
score:[90,87,79,95,100]
}
}
});
</script>
</body>
</html>
更多推荐
已为社区贡献2条内容
所有评论(0)