今天是vue基础知识和vue核心内容的第三天也是最后一天。后面我们会开始学习组件，整个基础内容都会随着生命周期的结束而结束。不得不说，张天宇把这堂课活了过来，开始觉得vue是活的东西，包括上面说的一大堆脏活累活。我们只是称呼它。我不忍心这样对待Vue，所以想了想，我肯定是对它最好的。最好的办法就是多练习代码优化，能省多少就省多少，就是让他少干活。14、采集表单数据==账号密码==使用v-model正常采集没有问题，是value的采集==单选框==刚用v-model有问题，vue管理工具返回null，因为v-model本身默认是收集值的，所以需要给单选框配置value==checkbox==checkbox不仅要写值，还要把绑定的值写成数组。checkbox不写值，vue默认v-model收集选中的值，只有满足两个条件，一个数组形式，并且写入一个值，才会正常收集被点击的复选框的值，其他都是普通手机。下拉选择框中手机的值，文本框收集值，==注意最后点击同意许可协议，这里可以直接使用默认勾选的值==最后，数据可以通过提交的点击事件或者表单提交事件上传到服务器，注意表单默认的提交行为是通过事件修饰符停止的。我们一般都是向服务器发送json格式的数据，所以这里的数据一般都是这样定义的。这样，之前的所有vue语法都需要在userInfo前面加上。==添加三个v-model修饰符==v-model.trim=""可以忽略输入内容前后的空格。number可以将采集到的值转化为数值类型，一般配合表单使用type:number，这样可以限制输入内容为数字，但是是字符类型，然后通过修饰符转化为数值类型。lazy失去焦点再获取数据，比如之前做过的防抖策略，输入一段时间后才请求数据，这里可以在表单元素上加上这个修饰符，只有当焦点丢失了。15.过滤器完成一个案例来显示格式化的时间。库时刻用于格式化时间。从本站下载BootCDN通过计算属性和方法函数实现==通过过滤器，过滤器其实和模板引擎的过滤器是一样的，连语法都一样，只是在实例中增加了一个新的配置项：filters==vue语法前面的时间就是管道symbol后面函数的参数，不用调用，vue会自动调用成==filters加上参数version==，除了前面的默认参数，他还可以自己加参数，这时候filterfunction相当于有两个参数这样子，我们上一段代码是不是有错误，因为前面没有第二个参数，format格式不可用==注意：这里可以使用一个es6形参赋值语法，如果第二个参数有则str以第二个参数为准，如果没有则使用我们在形参中定义的默认值====我们的过滤器可以一层层处理，处理完一个返回值layer可以继续交给下一个filter继续处理====vue实例中的filters定义的filters都是本地filters。虽然我们只有一个vm实例，但是以后会遇到组件开发，a组件没有使用b组件，里面定义的filters就是过滤器，所以如何定义全局的filters==filters不能只用在插值语法，还有v-bind绑定语法，只有v-bind、v-model或其他没有（不常用）==总结：适合做一些简单的逻辑处理，复杂的用计算属性实现。==16。内置指令16.1v-text将文本内容渲染到它所在的标签上，并将替换整个标签插值语法的内容只是插入到某个位置。16.2v-html同上，不过这个支持标签结构解析==注意：这个命令语法有安全问题。在网站上动态呈现任意html是非常危险的。易受xss攻击====v-html，永远不要在用户提交的内容上使用它==16.3v-cloak是一个特殊的属性，vue接管容器后会被vue删除，用css[attributeselector]它可以解决网速慢，vue还没有加载的问题（==这里是footerjs被阻塞了，因为js加载太慢导致页面被阻塞，无法继续==),页面首先出来一些字如{{name}}16.4v-once也没有命令语法。所有节点初始动态渲染后，静态内容将不再变化。未来的数据变化不会导致v-once被更新，有利于优化性能。16.5v-pre可以跳过vue的编译过程可以用来跳过不使用指令语法和插值语法的节点，加速编译v-，有细节的时候这里应该是一个对象。如果没有太多细节，可以直接简写成一个接收两个参数的函数。第一个参数使用这个自定义指令的标签，第二个Parameter这个指令绑定的表达式的对象是一个包含它的值，名称等的对象==自定义指令是什么时候调用的？当指令成功绑定元素时，即第一次渲染页面时，第二种情况是重新解析页面模板时，即无论从哪里发起重新解析，指令中的对象或函数将被再次调用。提到的函数不能处理一些细节问题，需要以对象的形式存在。这里有个要求。当我点击n的时候，我会添加它，同时在input里面会有一个n，会自动添加。这个逻辑按照上面的就可以完成，但是还有一个要求。我需要输入来获得焦点状态。这时候使用函数的方法就不行了。为什么，==需要考虑Vue的一个工作原理。我们说指令的触发时机在于指令和元素的成功。绑定的时候，问题就出现在这里，vue会先解析vue模板，然后这个时候指令和元素绑定成功，这个时候就会执行这个函数，但是这个时候整个过程，整个dom还在我们的虚拟dom中，vue还没有完成它的工作，所以input还没有出现在页面上，你给他焦点是不行的==所以现在我们要写customcommandasanobject,==和三个这个函数的三个句点，这三个名字不能改。肯定是这样的====所以==：我们一般的bind函数和update函数做的是一样的事情，结合上面两种简写形式触发时序，所以简写形式就是写的bind和update函数中的逻辑==注意==命名注意事项：我们给自定义命令命名，如果不能用两个词命名，我们需要使用中间的驼峰命名方式。-split，同时在directives中返回原来的定义方式，即给属性名加上引号，后面的函数仍然可以简写，不管是简写形式还是object形式，这是窗口。我们在指令中定义的指令是本地指令。如果其他组件需要使用该指令，则需要定义一个全局指令，像filter一样定义方法（没有s，实例中有s）18.生命周期18.1引出生命周期First,第一个注意点==动态绑定，如果它包含一组键值对。比如样式style需要写成一个对象==一个case派生的生命周期。要求页面一进入h2标题就产生渐变效果，没有任何触发点，会自己触发生命周期函数：我的理解，首先是挂载函数：Vue完成模板解析并将初始的真实DOM元素放入页面中，即挂载完成后，会使用这个挂载函数，相当于他只会执行一次，在vue的生命周期中只会执行一次。在那之后，它就会结束。我们vue.js的整个时期会有很多节点，很多关键节点。例如，这是解析后放入真实DOM中的节点。关键节点vue回调一些特殊的函数，整个函数完成vue的一个循环和一个完整的生命周期，所以这些函数称为生命周期函数（也叫生命周期，生命周期钩子）18.2分析生命周期（挂载过程)挂载过程从新建Vue开始，到挂载生命周期函数结束。首先，一切从newVue的一个实例开始，首先进入初始化。在这个初始化阶段，vue会把一些生命周期函数比如whatname和definition放在哪里，我们的一些事件定义，比如事件修饰符，这些都被初始化了，但是需要注意的是此时我们的data数据还没有解析时间，数据代理还没有启动，然后此时出现了第一个生命周期函数--==beforeCreate====注意如何下断点，一一看之前会发生什么这个阶段==可以看到页面没有解析，vm实例没有数据_dataNext开始第二次初始化。这个阶段开始数据代理和数据监控。同时，第二个生命周期函数==created==这时候确实可以看到_data数据，然后开始判断是否有el这个选项。如果是，就判断是否有模板模板，先说说这个模板。该模板在vm实例中定义。当我们执行完vue后，我们将把这个模板放入容器中。它和我们写在html结构中的区别在于，我们写在html中会有一个根div，但是这个必须用div或者盒子包裹起来，然后这个div会替换根容器继续我们的生命周期。如果我们发现没有template模板，我们就会解析我们的el容器作为模板。如果有模板，它将解析模板。==这个阶段，Vue开始解析模板。生成的虚拟dom页面无法显示解析后的内容==。一旦这个阶段出来，就会有一个生命周期函数==beforeMount==，此时页面呈现的是dom结构，没有vue编译，对dom的所有操作都不起作用，因为我们的虚拟dom会被插入到页面中很快，然后回去创建一个vmapi$el来放我们el中的所有标签，这个api的作用是，当我们比较虚拟dom，发现如果有元素可以复用，那么你必须找出哪里可以重用dom，所以在这里保存，时间到了另一个事件，==mounted==，现在页面中已经有了编译好的dom，至此，初始化结束，vue挂载过程结束。在这个函数中，可以==启动定时器，发送网络请求，订阅消息，绑定自定义事件等。==18.3分析生命周期（更新过程）挂载后会等待数据变化。当我们的数据发生变化时，会有一个函数，==beforeUpdate==这个时候数据是新的，但是页面还没有反应，也就是页面还没有和数据同步，然后新建一个虚拟DOM将立即生成，然后与旧的虚拟DOM进行比较。最后页面更新完成后，会有一个生命周期函数==updated==这时候数据是新的，页面也是最新的，页面和数据保持同步。18.4分析生命周期（销毁过程）是否执行==vm.$destroy==，如果执行这句，会立即进入==beforeDestroy==声明周期函数，一般使用该函数时，所有数据和vm中的方法可以访问，但最好不要修改或删除任何数据，因为没有意义，生命已经走到尽头，修复它之后，比如可以关闭定时器，取消订阅消息，解除绑定自定义时间等整理操作。这个事件之后，vm实例会被销毁，body上的所有指令和事件监听器（自定义事件）全部失效18.5总结生日和生日就像坐骑，所有开始的动作都可以写在这里，告别就像被摧毁。让我们处理一些我们之前创建的东西。vm.$destroy相当于自杀的功能。事实上，你不能自己调用??这个方法。在大多数情况下，这是谋杀。杀人需要组件支持。我稍后再说。在这里，我只能强行自杀。改进之前的透明案例，为什么定时器可以在点击事件停止而不是被销毁？生命周期功能停止，因为这是一个模拟的自杀操作，而且大部分时候是他杀，先不说他杀会不会触发这个事件，不管是谁杀了你，你都被消灭了，那你就得通过beforeDestroy函数的过程，所以所有的善后工作最好在这里
