码字不易，大家的支持就是我坚持下去的动力

专门在vue中实现集中式状态（数据）管理的一个Vue插件，对Vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信。使用场景：多个组件依赖于同一状态来自不同组件的行为需要变更同一状态。

如果要对插槽内的html添加样式，可以写在父组件中，也可以写在子组件中。vue的编译机制是：先在父组件中将插槽内容进行编译，然后嵌入子组件的。子组件中存在多个插槽，可以为每个插槽指定名称，父组件的内容需要按照插槽名称将Html嵌入子组件的对应插槽中。数据存储在定义插槽的子组件本身，但是生成数据的结构需要根据组件自身的使用者父组件来决定。作用：让父组件可以向子组件指定位置插入html结构，也是一种组件间通信的方式。所以写在父组件或者子组件中的样式都可以生效。父组件上使用插槽时，可以使用。

为false时，代理服务器发给服务端的请求来源host为代理服务器真实的host，服务端接收到的请求来源的host为：localhost:8080。为true时，代理服务器会“欺骗”服务端，用服务端的host当做请求来源host，服务端接收到的请求来源的host为：localhost:5000。工作方式：若按照上述配置代理，当请求了前端不存在的资源时，那么该请求会转发给服务器。代理服务器的端口号和Vue端口号相同，所以访问代理服务器时不存在跨域问题。优点：可以配置多个代理，且可以灵活的控制请求是否走代理。

使用css动画样式，配合vue实现动画效果。编写动画样式要使用vue动画的标签使用包裹将进入的动画样式改为，离开的动画改为：总结：如果要使用css动画配合vue，需要：如果页面中有多个，需要有不同的动画样式，可以为指定属性：此时定义的入场动画、离场动画的也需要被替换为指定的名称：页面刚打开时，没有动画效果，如果需要在页面打开就直接展示动画效果，需要使用属性设置为true：过渡使用vue的过渡实现动画效果。编写样式总结：vue的过渡效果中：入场动画位置起点，入场动画

当改变数据后，要基于更新后的新DOM进行某些操作时，要在nextTick所指定的回调函数中进行。例如：在本次逻辑执行完毕后，让指定的输入框获取焦点。在下一次DOM更新结束后执行其指定的回调。

pubsub的回调函数中，第一个参数是订阅的消息名，这个参数一般用不到，但是还需要占位，一般使用。组件间通信方式，适用于任意组件间通信。

等相关方法，这些方法在Vue原型上，所以需要总线对象是Vue实例或者VueComponent组件实例。如果要满足任意组件间通信，需要所有组件都能拿到该对象。自定义事件被触发时，在Vue的浏览器插件中切换到事件页面，可以看到触发的事件。极不推荐方式2修改源码。推荐使用方式3绑定在Vue原型上。如果要将对象设置成Vue实例对象，则需要利用Vue的。以上两种方式都可以正常使用，推荐使用方式2规范写法。一种组件间通信方式，适用于任意组件间通信。解绑当前组件所用到的事件。

- 自定义myEvent事件 --> < Student v-on: myEvent = ' getStudentName ' />-- 自定义myEvent事件 --> < Student v-on: myEvent = ' getStudentName ' />-- 自定义myEvent事件 --> < Student v-on: myEvent = ' getStudentName ' />

localStorage、sessionStorage统称为webStorage。存储内容大小一般支持5MB左右（和浏览器有关）。浏览器通过属性实现本地存储机制。：该方法接收一个键和值作为参数，会把键值对添加到存储中，如果键名存在，则更新其对应的值。：该方法接收一个键名作为参数，返回键名对应的值：该方法接收一个键名作为参数，并把该键名从存储中删除：该方法会清空存储中的所有数据sessionStorage存储的内容会随着浏览器窗口关闭而消失。

组件化编码流程：拆分静态组件：组件要按照功能点拆分，命名不要与html元素冲突实现动态组件：考虑好数据的存放位置，数据是一个组件在用还是一些组件在用：a. 一个组件在用：放在组件自身即可b. 一些组件在用：放在他们共同的父组件上（即状态提升）实现交互：从绑定事件开始父组件到子组件的通信子组件到父组件的通信（要求父组件先给子组件传递一个函数）使用v-model是要注意：v-model绑定的值不能是props传过来的值，因为props是不可以修改的。

最新版的less-loader只支持webpack5，但是目前Vue脚手架中引入的webpack是4.46版，所以不能直接下载最新版的less-load，需要加上版本限制。如果在App组件中同时引入了School、Student两个组件，则这两个组件的样式都会被引入。组件中定义的样式，默认是全局都有效的，vue最终会把这些样式汇总到一起。之后，这个样式只会对当前组件有效，对当前组件引入的子组件无效。组件的样式最终汇总出来的顺序，取决于在父组件中引入的顺序。属性声明该样式使用的语言。data-v-随机数。

示例：定义一个插件（插件需要实现。install方法的第一个参数是。plugin用于增强Vue。，后面还可以继续接收到。

mixin 可以把多个组件公用的配置提取成一个混入对象。示例：定义一个混合 mixin.js。也可以全局使用混合，在。

配置项中另外定义一个变量，将父组件传入的值赋值给新建的变量。(Vue会先接收父组件的值，然后才解析组件的。如果父组件没有传入必须的参数，会在浏览器控制台报错。接收自父组件的值不能直接修改，否则可能会出问题。如果要向子组件传递一个数值类型的变量，可以使用。此时，如果父组件向子组件传入了一个字符串类型的。配置项让组件接收外部传过来的数据。子组件中，要接收的参数不能配置到。配置项中可以接收到父组件的值)做为表达式表示数值32。的内容是js表达式，

应用在html标签上时，获取的是真实dom元素；应用在组件标签上时，获取的是组件实例对象。ref属性被用来给元素或子组件注册引用信息（id的替代者），避免在vue中使用。

输送给webpack。webpack是基于NodeJS的，NodeJS的模块化采用的是CommonJS。最后会使用当前项目的。在编写代码的过程中，vue脚手架会实时的做代码检查，如果检查出问题、没有使用的变量等就会在控制台报错。webpack常见的语法检查loader：eslint、jslint、jshint。是一个可选配置文件，如果要修改脚手架配置，需要添加该文件，路径要和。此处输出的文件只能查看，修改了也不生效。中的配置替换相关脚手架配置。一般情况下不会修改默认配置。

但是该写法在脚手架中会报错。因为脚手架默认引入的是个残缺版的vue。如果要避免报错，有2种解决方案：引入完整版的vue或者使用rander实际引入的是，是一个不含模板解析器的js。引入的js是配置在vue模块的module配置项中。这时就可以正常的在new Vue中使用template配置。如果使用了残缺版的vue，就需要使用render替换template配置。因为render没有用this。

Vue脚手架是Vue官方提供的标准化开发工具（开发平台）。Vue脚手架的最新版本是4.x，这个版本和项目使用的Vue版本无关。全局安装脚手架：

Vue组件 📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。

Vue生命周期 📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍mounted、另外还有一些其他和路由相关的生命周期钩子。销毁后借助Vue开发者工具看不到任何信息销毁后自定义事件会失效，但是之前通过v-bind绑定的原生DOM事件（on-click等）依然有效一般不会在中操作护具，因为即使操作数据，也不会再触发更新流程了。先赞后看，养成习惯！！！码字不易，大家的支持就是我的坚持下去的动力。

Vue自定义指令 📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍示例：

Vue过滤器 📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。

Vue收集表单数据 📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。

Vue监测数据原理 📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。

📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。vue计算属性与监视

数据绑定最常见的形式就是使用"Mustache"语法（双大括号）的文本插值。vue提供了完全的javascript表达式支持。常用系统指令v-on可以使用指令监听DOM事件，并在触发时运行一些JavaScript代码。例如：使用v-on:click处理onclick事件使用绑定按键按下事件，使用作为参数获取事件对象：可以简写为，例如：vue中为提供了事件修饰符来处理dom事件细节，如。vue中阻止事件传播：内部有一个，此时如果鼠标移动到child上时，会先触发child绑定的鼠标移入事件；执行完

📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍VUE：vue.js是一个构件数据驱动的Web界面的渐进式框架。Vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。MVVM：MVVM是l的缩写，它本质上是MVC的改进版。MVVM就是将其中的View的状态和行为抽象化，让我们将视图UI和业务逻辑分开。

📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。

📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍一个路由就是一组映射关系(key-value)key为路径，value可能是function或component。

📋前言📋💝博客：【无聊大侠hello word】💝✍有一点思考，有一点想法，有一点理性！✍✍本文由在下【无聊大侠hello word】原创，首发于优快云✍。

Vue介绍VUE：vue.js是一个构件数据驱动的Web界面的渐进式框架。Vue.js的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。MVVM：MVVM是model - view - viewModel的缩写，它本质上是MVC的改进版。MVVM就是将其中的View的状态和行为抽象化，让我们将视图UI和业务逻辑分开。MVVM模式和MVC模式一样，主要目的是分离视图（View）和模型（Model）。