<!-- Vue--v-for -->
<DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Vue.js</title>
<link rel="stylesheet" href="style6.css">
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
<div id="vue-app">
<h1> v-for</h1>
<h3></h3>
<p v-for="title in titles">{{ title }}</p>
<!-- <p v-for="(who,index) in whos">{{ index+1 }}--{{who.name}}--{{who.age}}</p> -->
<template v-for="(who,index) in whos"><p>{{ index+1 }}--{{who.name}}--{{who.age}}</p></template><!-- 推荐用template包裹，可以避免重复出现 -->
</div>
<script src="app8.js"></script>
</body>
</html>
new Vue({
el:"#vue-app",
data:{
titles:["sally","fah","zouzou"],
whos:[
{name:"afa",age:12},
{name:"hk",age:21},
{name:"sdf",age:23}
]
},
methods:{
},
computed:{
}
});
网友评论