Vue.js(MVVM)

2019-10-18 114 阅读1分钟

Vue.js(MVVM)

1. MV*模式认识(MVC,MVP,MVVM)

链接详情mv*

2. Vue第一个案例

<body>
<div id="box">
    {{ msg }}
</div>
<div class="box">
    {{ msg }}
</div>
</body>
<script src="../lib/vue.js"></script>
<script>
new Vue({
    el: "#box",
    data: {
        msg: "Hello vue1"
    }
})
new Vue({
    el: ".box",
    data: {
        msg: "Hello vue2"
    }
})
</script>

</html>

3. 匿名函数的优点

1 防止全局作用域
2 防止命名冲突
3 防止一些脚本的攻击
4 封装js库基本上都是用它来完成

4. 数据驱动视图

意义：当数据发生改变时，视图也会随之改变
我们从现在开始，不在关注v的变化了，我们关注data

5. new Vue()

 new Vue()得到的结果，我们是以标签化呈现的，<Root></Root> ，我们称之为：<font style ="color: red;">  根实例组件 </font>