【无标题】

1. 如何展示数据和绑定事件
2. 如何控制路由实现页面跳转
3. 路由如何携带参数
4. 如何异步提交和获取数据

阶段学习笔记
vue的安装

1. 可下载生产的文件
2. 在文件中引用一句话：

介绍：

1. Vue.js是一个渐进式JavaS框架
   a. 渐进式:由浅入深，由简单到复杂的方式去使用js
2. vue.js优点
   a. 体积小
   ⅰ. 压缩后33k
   b. 更高的运行效率
   ⅰ. 基于虚拟dom，一种可以预先通过JavaScript进行各种计算，把最终的DOM操作计算出来并优化的技术，由于这个DOM操作属于预处理操作，并没有真是操作DOM，所以叫做虚拟DOM
   c. 算共享数据绑定
   ⅰ. 让开发者不用再去操作dom对象，把更多的精力投入到业务逻辑上
   d. 生态丰富，学习成本低
   ⅰ. 市场拥有大量成熟，稳定的基于vue.js的ui框架，常用组件！拿来即用实现快速开发！
3. 声明式渲染
4. 条件与循环
5. 处理用户输入
6. 组件应用构建

vue实例

1. 创建一个Vue实例
2. 数据与方法
3. 实力生命周期钩子
   模板语法
4. 插值

计算属性和侦听器

1. 计算属性
2. 计算属性缓存vs方法
3. 计算属性vs侦听属性

样式绑定

1. 通过简单的判断一个值是true还是false来决定某个样式的展示

事件处理器

1. 主要是点击事件，即点击某个按钮后触发的一系列的事件的应用
2. 事件修饰符
3. 案件修饰符

表单

1. 修饰符？？？
   a. .lazy
   b. .number
   c. .trim

组件：

1. 组件介绍：实现应用中局部功能代码和资源的集合

2. 组件名规范：
   a. 单个单词：首字母大小写都可以，但是大写可以和开发者工具呼应上
   b. 多个单词：
   ⅰ. ’my-school‘呈现的是：，
   ⅱ. 直接用每个单词的首字母大写（需要使用脚手架）
   c. 一个组件的通常使用，在vm（root）（中注册app，用app管理（注册其他所有组件））

3. 组件全过程：创建——注册——使用
   a. 创建：
   ⅰ. 一定不要写el配置项：因为最终所有的组件都要被一个vm管理，由vm决定服务于那个容器
   ⅱ. data必须写成函数式而不是对象式
   ⅲ. template：‘ html结构’
   ⅳ. 创建组件其实是创建一个vuecomponent的实例对象
   b. 注册：
   ⅰ. 创建vm

   1. 三部分： el配置项，data对象，components注册
   2. el配置项：
   3. data对象：data：{msg:‘数据内容’},
   4. 全局注册
      a. 介绍：同一个html都可以使用，不受容器限制
   5. 局部注册
      a. 介绍:只能在el配置项的容器中的使用
      b. components：{组件标签：组件名，组件标签：组件名}
      c. 使用：
      ⅰ. 准备好一个容器
      ⅱ. 编写组件标签

4. 配置项：vc与vm都是可复用的Vue实例，所以他们与new Vue接受相同的选项，例如data，computed,watch,methods以及生命周期钩子等，仅有的例外是像el这样根实例特有的选项。

5. 单文件组件：
   a. 介绍：只有一个组件的文件

6. 非单文件组件
   a. 介绍：有一个以上的组件组成的文件

7. 自定义组件
   a. data 必须是一个函数
   上面例子中，可以看到 button-counter 组件中的 data 不是一个对象，而是一个函数：
   这样的好处就是每个实例可以维护一份被返回对象的独立的拷贝，如果 data 是一个对象则会影响到其他实例，

路由

1. 介绍：路由允许我们通过不同URL访问不同的内容（需要导入vue-router库）
2. 是一个组件，该组件用于设置一个导航连接，切换不同HTML内容。to属性为目标地址，既要现实的内容
   a. 属性：
   ⅰ. to
   ⅱ. replace
   ⅲ. append
   ⅳ. tag
   ⅴ. active-class
   ⅵ. exact-active-class
   ⅶ. event
3. 路由传参：
   a. query参数
   b. params参数

过度

混入

1. 介绍：混入定义了一部分可复用的方法或计算属性，混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项

方法：
2. Object.freeze();
3. v-once
4. v-bind

new Vue({
el: ‘#app’,
data: {
url: ‘http://www.runoob.com’
}
})
a.
5. number+1
6. 三元运算
7. message.split(’ ‘).reverse().join(’')先拆分在反序再组合
8. v-if=" "
a. 判断这个标签及以下标签是否显示
b. true则显示，false则不显示
9. watch

不熟悉名词：
10. 基于Node.js
11. cli
12. 声明式渲染
13. 对象
a. 头，一级名，二级名，三级名
b. 头：var vm =new Vue（{ ）}
c. 一级头：
ⅰ. el：
1. 内写el名，
ⅱ. data:
d.
14. 实例
15. 属性：
a. var vm=new Vue（{
b. el：“#app”
c. data:data
d. });
e. 其中el与data为属性
16. 响应式
17. attribute
18. API文档
19. 选项对象
20. 组件树
21. property
22. $
a. 除了数据 property，Vue 实例还暴露了一些有用的实例 property 与方法。它们都有前缀 $，以便与用户定义的property区分开来b.也就是说带有$符号的都是vue已经定义的方法
23. 生命周期钩子：
a. 是一个函数
b. 比如
ⅰ. created 钩子可以用来在一个实例被创建之后执行代码：
ⅱ. 如 mounted、updated 和 destroyed
24. 生命周期
a. 图示：
b.
25. 数据
26. 方法
27. 模板语法
28. 插值
29. 文本
30. 原始html
31. 指令：
a. 指令是带有v-前缀的特殊属性。
b. 指令用于在表达式的值改变时，将某些行为应用到DOM上
c. 可以判断这个标签下的元素是否存在
32. 参数：
a. 在指令后用冒号指明。
b. 修饰符是以半角句号 . 指明的特殊后缀，用于指出一个指令应该以特殊方式绑定。例如，.prevent 修饰符告诉 v-on 指令对于触发的事件调用 event.preventDefault()：
33. 修饰符
34. 动态参数
35. 计算属性
36. 侦听属性
37. 属性：html属性中的值应使用v-bind指令
38. 缩写
a. Vue.js 为两个最为常用的指令提供了特别的缩写：
ⅰ.
ⅱ. <a @click=“doSomething”>
39. 组件：
a. 可以扩展HTML元素，封装可重用的代码
b. 分类
ⅰ. 全局组件语法
ⅱ. 局部组件
c. prop
ⅰ. 介绍：prop是子组件用来接受父组件传递过来的数据的一个自定义属性
ⅱ. 说明：父组件的数据需要通过 props 把数据传给子组件，子组件需要显式地用 props 选项声明 “prop”：
ⅲ. 其他：动态prop
d. 步骤：注册-自定义组件-创建根实例
e. 理解：用component定义这个组件，然后创建根实例为组件定义一个标签名，以供使用
40. ref属性
a. 被用来给元素或子组件注册引用信息（id的替代者）
b. 应用在html标签上获取的是真实DOM元素，应用在组件上是组件实例对象（vc)
c. 使用方式：
ⅰ. 打标识：<h1 ref+“xxx”>…或
ⅱ. 获取：this.$refs.xxx

代办问题：
41. 混入对象，组件，实例对象的不同（几层的区别）
42. 模块是vue 里的吗
43. 有空格分开的类名是只属于vue吗
44. 用vue做todolist的准备环境有哪些
45. 生命周期钩子mounted
46. 三种实现组件间通信的方法

拼写易错：
47. var app6 = newVue({
48. el: ‘#app-6’,
49. el: ‘#app-6’,
50.