【Vue.js学习】二、Vue的列表展示

一、展示数据列表

• 遍历数据：使用了Vue的一个语法 ：v-for = "别名 in 数组名"
• 展示数据：{{别名}}

1. 创建一个movies数组

<script>
    const app = new Vue({
        el: '#app',
        data:{
            message:'你好',
            movies:['星际穿越','大话西游','少年派','盗梦空间']
        }
    })
</script>

2. 使用了v-for进行遍历

<div id="app">
    <ul>
        <li v-for ="item in movies">{{item}}</li>
    </ul>
</div>

3. 效果
   

二、Vue是响应式的

• 可以直接在浏览器中添加数据