1、Vue.js是什么?
vue就是一个js库,核心只关注视图层 。
2、为什么使用?
- 声明式,响应式的数据绑定
- 组件化的开发
【vue一小时入门】vue的核心是mvvm模式,mvvm是Model-View-ViewModel的简写 。
Model:【模型】指的是传递的数据 。
View:【视图】指的是页面 。
ViewModel:【视图模型】mvvm模式的核心,它是连接【视图】和【模型】的桥梁 。
它有两个方向:
一是将【模型】展示到【视图】 , 即将数据展示到页面 。实现的方式是:数据绑定 。
二是将【视图】转化成【模型】,即将页面转化成数据传递到后端 。实现的方式是:DOM 事件监听 。
这两个方向都实现的,称之为数据的双向绑定 。
4、Vue入门
{{ message }}视图视图模型 new Vue() ( el: '#app':绑定视图 )模型 {message: 'Hello Vue!'}
5、常用指令V-if
{{ msg}}测试V-if- V-else
小于等于10大于10- V-else-if
小于等于1010 && age<15">大于10并且小于15大于15- V-for循环
- {{item.name}} {{item.age}}
- V-show 判断是否显示
{{ msg}}测试V-if测试v-show- V-model 数据双向绑定
- V-bind绑定属性
绑定style绑定class绑定style绑定class- V-on 绑定事件
6、Vue实例 生命周期钩子
7、计算属性和侦听器
语文数学英语总分:{{ zongfen }}总分:{{ zongfen }}8、组件
- 组件注册
- 组件自定义属性(父子组件之间 “传值”)
- 监听子组件事件(子组件传值到父组件)
