之前的那个案例只是在页面展示了一个消息。现在要展示一个列表
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<div id="app">
<ul>
<li v-for="item in movies">{
{item}}</li>
</ul>
</div>
<script src="../js/vue.min.js"></script>
<script> // 创建vue的对象,将对象赋值给常量,以const定义常量.创建对象里面要传入参数 const app = new Vue({
el: '#app', // 用于挂载需要管理的元素,我们自己创建了一个div,现在就要用vue管理我们创建的div.用el这个属性 和div产生联系 data: {
//这个属性里面就是定义数据,里面是以键值对的形式 进行创建数据,之后我们就可以在div里面拿到这个里面的数据 movies: ['电影1','电影2','电影3'] } }) </script>
</body>
</html>