本站于2023年9月4日。收到“大连君*****咨询有限公司”通知
说我们IIS7站长博客，有一篇博文用了他们的图片。
要求我们给他们一张图片6000元。要不然法院告我们

为避免不必要的麻烦，IIS7站长博客，全站内容图片下架、并积极应诉
博文内容全部不再显示，请需要相关资讯的站长朋友到必应搜索。谢谢！

另祝：版权碰瓷诈骗团伙，早日弃暗投明。

相关新闻：借版权之名、行诈骗之实，周某因犯诈骗罪被判处有期徒刑十一年六个月

叹！百花齐放的时代,渐行渐远!

---

生命周期

     BeforeCreate 数据观测初始化事件还未开始 el 和 data 并未初始化

     进行初始化事件，进行数据的观测，可以看到在created的时候数据已经和data属性进行绑定，无el选项

     Created 完成数据观测，属性和方法的运算，初始化事件，el属性还没有显示出来判断对象是否有el选项。如果有的话就继续向下编译，如果没有el选项，则停止编译，也就意味着停止了生命周期，直到在该vue实例上调用vm. el属性还没有显示出来判断对象是否有el选项。如果有的话就继续向下编译，如果没有el选项，则停止编译，也就意味着停止了生命周期，直到在该vue实例上调用vm.el属性还没有显示出来判断对象是否有el选项。如果有的话就继续向下编译，如果没有el选项，则停止编译，也就意味着停止了生命周期，直到在该vue实例上调用vm.mount(el)

     BeforeMount 在挂载开始之前被调用，相关的render函数首次被调用。完成了 el 和 data 初始化

     创建vm.el并用其替换“el”Mounted在el被新创建的vm. el 并用其替换“el”Mounted 在el 被新创建的 vm.el并用其替换“el”Mounted在el被新创建的vm.el 替换，并挂载到实例上去之后调用。

     挂在完毕如果调用vm.$destory()

     BeforeUpdate 在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前

     虚拟DOM 重新渲染并应用更新

     Updated 由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用

     BeforeDestroy 在实例销毁之前调用。实例仍然完全可用。

     解除绑定，销毁子组件以及事件监听器

     Destroyed 在实例销毁之后调用。所有的事件监听器会被移除，所有的子实例也会被销毁

     从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、销毁

V-指令

     v-model v-bind v-show v-if v-for v-on v-once v-htm

V-model原理

     v-model就是vue的双向绑定的指令，能将页面上控件输入的值同步更新到相关绑定的data属性，也会在更新data绑定属性时候，更新页面上输入控件的值。

     <input v-bind: value=”something” v-on:input=”something = $event.target.value”>

     接受一个value属性

     在有新的value属性时触发input事件

     v-model 是动态的双向数据绑定（只能用在input, textarea, select上）

     .lazy .trim .number

MVVM

     Model代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑。

     View 代表UI 组件，它负责将数据模型转化成UI 展现出来。

     ViewModel 监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步View 和 Model的对象，连接Model和View。

     在vue中，使用了双向绑定技术，就是View的变化能实时让Model发生变化，而Model的变化也能实时更新到View。

     MVC有厚重的View Controller，无处安放的网络逻辑，较差的可测试性

组件参数传递

     父组件传给子组件：子组件通过props方法接受数据;

     子组件传给父组件：$emit方法传递参数

     Vuex多组件共享状态(数据的管理) 组件间的关系也没有限制 功能比pubsub强大, 更适用于vue项目

     Slot通信是带数据的标签

     Pubsub第三方库(消息订阅与发布)适合于任何关系的组件间通信

hash模式 history模式

     hash模式：在浏览器中符号“#”，#以及#后面的字符称之为hash，用window.location.hash读取

     history模式：history采用HTML5的新特性；且提供了两个新方法：pushState（），replaceState（）可以对浏览器历史记录栈进行修改，以及popState事件的监听到状态变更

vuex

     State：存放数据状态，不可直接修改里面数据

     Mutations：定义的方法动态修改Vuex的store中的状态或数据

     Getters：类似vue的计算属性，主要用来过滤一些数据。

     Action：可以理解为通过将mutations里面处理数据的方法变成可异步的处理数据的方法，简单的说就是异步操作数据。view 层通过store.dispath 来分发 action。

     Modules：项目特别复杂的时候，可以让每一个模块拥有自己的state、mutation、action、getters,使得结构非常清晰，方便管理。

keep-alive

     Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。

vue.js的两个核心

     数据驱动、组件系统

修饰符

     .prevent: 提交事件不再重载页面；

     .stop: 阻止单击事件冒泡；

     .self: 当事件发生在该元素本身而不是子元素的时候会触发；

     .capture: 事件侦听，事件发生的时候会调用

vue的key值

     用于管理可复用的元素。因Vue 会尽可能高效地渲染元素，通常会复用已有元素而不是从头开始渲染。这么做使Vue变得非常快，为了高效的更新虚拟DOM

route & router

     router是VueRouter的一个对象，通过Vue.use(VueRouter)和VueRouter构造函数得到一个router的实例对象，这个对象中是一个全局的对象，他包含了所有的路由包含了许多关键的对象和属性。

     route是一个跳转的路由对象，每一个路由都会有一个route对象，是一个局部的对象，可以获取对应的name,path,params,query等

computed & watch     

     computed是一个计算属性，类似于过滤器，对于绑定到view的数据进行处理，具有缓存性，简化了计算和处理过程 有get和set

     watch是一个观察动作，监听props，$emit等异步操作，无缓存性

     computed的话是通过几个数据的变化，来影响一个数据，而watch，则是可以一个数据的变化，去影响多个数据

     当一个属性受多个属性影响的时候就需要用到computed

     当一条数据影响多条数据的时候就需要用watch

Vue-router 和location.href

     使用location.href=’/url’来跳转，简单方便，但是刷新了页面；

     使用history.pushState(’/url’)，无刷新页面，静态跳转；

传参

路由传参：

     router.js 后边跟:id配置参数

     query 方法传参

     name 方法传参

     vue自带标签标签传参

组件传参：

     父传子 props

     子传父 this.emit非父子组件eventHub中转站this. emit非父子组件 eventHub 中转站 this.emit非父子组件eventHub中转站this.on

vuex state 存的变量，mutations改变的状态 actions 触发的行为（方法）

组件的引入

     导入组件import Vheader from ‘./components/Vheader.vue’

挂载组件在export default 中 定义一个key为components，值为一个对象，这个对象中放着导入键值对；键为变量名，值为组件名，在es6中，键值相同时，可以缩写为一个单一的值。比如：components：{ Vheader }

文章来源：CSDN博客

原文链接：https://blog.csdn.net/qq_41409438/article/details/105248741

如有侵权，请联系本人删除