vue总结
模板
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>初识Vue</title>
<!--引入Vue-->
<script type="text/javascript" src="../js/vue.js">注意检查这里的路径../</script>
</head>
<body>
<!--设置不提示-->
<script type="text/javascript" >
Vue.config.productionTip = false;
const vm = new Vue({
})
vm.$mount('#')
</script>
</body>
</html>
插值语法：标签体内容、指令语法
单向数据绑定、双向数据绑定
<div id="test01">
单向数据绑定 ：<input type="text" :value="name1">
双向数据绑定 ：<input type="text" v-model="name2">
</div>
用户代码片段简写 el和data的两种写法
- el绑定模板 ：v.$mount('#test01')
- data:函数式（推荐），由Vue管理的函数，一定不要写箭头函数，写了this就不是指定Vue实例了
const v = new Vue({
data(){
return{
name1:'张三'
}
}
})
// 绑定模板
v.$mount('#test01')
MVVM
- M ：模型（Model）==> 对应data中的数据
- V ：视图（View ） ==> 模版
- VM ：视图（模 型）==> Vue实例对象
数据代理：通过一个对象代理对另一个对象中属性的操作（getter、setter）
数据代理的应用
事件处理
新东方公司福利 1283人发布