1.绑定数据及事件：

title:{{name}} 翻转

注意：v-on和v-bind的区别：v-on 指令添加一个事件监听器；v-bind 各类数据绑定指令

2.响应式数据：

age:{{age}}

注意：mounted声明周期——页面挂载时触发事件

3.表单数据双向绑定：

v-model绑定表单数据，别忘了挂载事件

4.条件if：控制元素显示隐藏

切换显示状态

v-if条件判断，符合条件显示，否则不渲染

5.列表循环

a.遍历数组： v-for="item in lists" ，数组格式 items: [{ tag: '花菜' }, { tag: '菠菜' }，{ tag: '大白菜' }]

注意：v-for="item in lists" 直接绑定到循环元素上，小程序绑定数据是在父元素上，注意区分！

v-for 还支持一个可选的第二个参数，即当前项的索引。 v-for="(item, index) in items" 

v-for 也可以用 of 替代 in 作为分隔符。  v-for="item of items"

b.遍历对象：v-for="item in myo" ，对象格式： myo: {title: 'How to do lists in Vue',author: 'Jane Doe',publishedAt: '2020-03-22'}

注意：遍历对象是，v-for的参数可以有三个，依次为：值，键值，索引

6.组件创建

注意：1.组件的创建方式；2.props:['todo'], 设置参数注意格式；3.v-bind:todo="item"，数据传递至组件参数内

7.应用实例创建

const app = Vue.createApp({ data(){ return{ count:4 } }})

8.组件实例 property

const vm = app.mount('#app')

注意，获取实例数据的方式：console.log(vm.count)   => 4

8.v-once一次性地插值，数据再发生变化就不再更新了:

我是一次性值：{{onceV}}

注意:v-once必须放到绑定元素的子元素上

9.v-html插入html

10.v-bind绑定html的attribute属性值

用来绑定title,src,data-*...所有元素本身或自定义的值

11.使用JavaScript 表达式，仅支持三元或单个表达式

12.v-on监听 DOM 事件

v-on:click="doSomething"

12.动态参数

v-bind:[attributeName]="url"和v-on:[eventName]="doSomething"，当“[]”里面的动态参数变化时，相当于绑定的属性值和事件发生了变化

去百度 点击切换为跳转链接

注意：v-bind动态参数时[参数名]和后面的值url都必须是动态的数据，v-on也一样

13.data

组件的 data 选项是一个函数。Vue 在创建新组件实例的过程中调用此函数。它应该返回一个对象，然后 Vue 会通过响应性系统将其包裹起来，并以 $data 的形式存储在组件实例中。

通过vm = dd.mount('#dd')将声明实例，vm.$data.num和vm.num的方法都可以获取到data的值，也可以改变data的值（F12查看打印值）

14.计算属性getter

计算属性默认只有一个getter,也可以新增setter,我的理解：直接通过参数当函数名，挂载时会立即执行计算属性

15.侦听器

注意：tt.$watch('nowtime',function(n,o){/*n为新值，o为旧值*/})

16.Class绑定

注意：绑定class属性值是单括号{}——动态class名可以带引号，也可以不带，当然也可以是一个对象：包含多个class绑定样式，绑定事件不带括号，绑定文本值是双括号{{}}

17.Style内联样式绑定

注意：内联样式属性名可以用驼峰式，或短横线分割,也可以是一个对象/数组

18.条件渲染

v-if/v-else/v-else-if 

v-show

注意：v-if是真的渲染和销毁了；v-show只是css控制的显示隐藏，html还在