vue的基本组成
Vue是一个基于MVVM模型的前端js框架
特点：在整个过程中，程序员都不需要直接对标签进行操作，只关心数据即可。
-
新建HTML页面，引入Vue.js文件
<script src="js/vue.js"></script>-
在JS代码区域，创建Vue核心对象，定义数据模型
<script>
<!-- 定义Vue对象 -->
new Vue({
el: "#app",//vue接管的区域
data:{
message:"Hello vue"
}
})
</script>-
编写视图
<body>
<div id="app">
<input type="text" v-model = "message">
{{message}}
</div>
</body>插值表达式
在编写视图中用到了一个插值表达式
形式：{{表达式}}
表达式里面的内容可以是：
-
变量
-
三元运算符
-
函数调用
-
算术运算
常用指令
指令：HTML标签上带有V-前缀的特殊属性，不同的指令具有不同的含义。
| 指令 | 作用 |
|---|---|
| v-bind | 为HTML标签绑定属性值，为其动态的赋值，如设置href,css样式等，使用时可以省略 |
| v-model | 在表单元素上创建双向数据绑定 |
| v-on | 为HTML标签绑定事件，使用时可以用@代替 |
| v-if，v-else-if，v-else | 条件性的渲染某元素，判定为true时渲染，否则不渲染 |
| v-show | 根据条件展示某元素，区别在于切换的是display属性的值 |
| v-for | 列表渲染，遍历容器的元素或者对象的属性 |
注意：
-
通过v-bind或者v-model绑定的变量，必须在数据模型中声明
生命周期
指的是对象从创建到销毁的整个过程
一般的我们只掌握mounted的生命周期的方法，它与methods平级。
mounted：挂载完成，Vue初始化成功，HTML页面渲染成功。(作用：发送请求到服务端，加载数据)
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
