weixin_55869781的博客

一、this及this指向1. 普通函数的this指向函数的this指向遵循一个基本原则：谁调用的函数，函数的this就指向谁，否则指向全局window.name = 'yuguang';var getName = function(){ console.log(this.name);};getName(); // yuguang2. 箭头函数的this指向首先我们要知道，箭头函数本身是没有 this，箭头函数 this 是定义箭头函数时父级作用域的 this，也就是说使用箭

vue中的v-model可以实现双向绑定，其核心思想通过Object.definePropery来对Vue的数据进行数据劫持，主要分为三部分observer主要是负责对Vue数据进行数据劫持，使其数据拥有get和set方法需要observer的数据对象进行递归遍历，包括子属性对象的属性，都加上 setter和getter这样的话，给这个对象的某个值赋值，就会触发setter，那么就能监听到了数据变化指令解析器负责绑定数据和指令，绑定视图更新方法compile解析模板指令，将模板中的变量替换

Vuex是什么？官网解释：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex 也集成到 Vue 的官方调试工具 devtools extension (opens new window)，提供了诸如零配置的 time-travel 调试、状态快照导入导出等高级调试功能。Vuex的核心概念State 单一状态树Vuex 使用单一状态树——是的，用一个对象就包含了全部的应用层级状态。至

vue-router钩子函数全局路由钩子函数每次路由跳转，都会执行beforeEach和afterEachbeforeEach和afterEach是vue-router实例对象的属性router.beforeEach：router.beforeEach(function (to,from,next) { console.log(to);//到达的路由 console.log(next);//管道中，可以跳转到其他路由 console.log(from);//离开的路由 next

官方定义：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM什么意思呢？我们可以理解成，Vue 在更新 DOM时是异步执行的。当数据发生变化，Vue将开启一个异步更新队列，视图需要等队列中所有数据变化完成之后，再统一进行更新原理：Vue实现响应式并不是数据发生变化之后DOM立即变化，而是异步执行DOM更新的。异步执行的运行机制是什么样的？（1）所有同步任务都在主线程上执行，形成一个执行栈（execution context stack

我们在开发过程中会碰到数据更新，但是视图并未改变的情况，情况如下：1. 直接添加或删除属性原因：官方 - 由于 JavaScript（ES5） 的限制，Vue.js 不能检测到对象属性的添加或删除。因为 Vue.js 在初始化实例时将属性转为 getter/setter，所以属性必须在 data 对象上才能让 Vue.js 转换它，才能让它是响应的。var vm = new Vue({ data:{ obj: { id: 001 } }, // 页面不会变化

使用Vue框架搭建项目时，会使用到很多的指令，进行数据渲染时，我们一般会用到v-for，那么我们发现在使用v-for时，经常会写一个key值，那么这个key值得作用是什么？vue中在进行列表渲染的时候，会默认遵守 就地复用策略就地复用策略：当在进行列表渲染的时候，vue会直接对已有的标签进行复用，不会整个的将所有的标签全部重新删除和创建,只会重新渲染数据，然后再创建新的元素直到数据渲染完为止Vue中为v-for提供了一个属性，key：key属性可以用来提升v-for渲染的效率！，vue不会去改变原

首先面对这个问题，尽量不要让v-for和v-if处于同一元素那么当v-for和v-if处于同一元素上时，在Vue 处理指令时，v-for的优先级会高于v-if这意味着 v-if将分别重复运行于每个 v-for循环中。当你想为仅有的一些项渲染节点时，这种优先级的机制会十分有用，如下：<li v-for="item in list" v-if="!item.isComplete"> {{ item}}</li>上面的代码只传递了未完成的 todos。而如果你的目的是有条

v-if和v-show的分析我们在写vue项目的时候，经常会需要控制"条件渲染",大多数时间我们会使用v-if和v-show来控制，那么二者之间有什么区别吗？相同点：都可以动态控制着dom元素的显示隐藏不同点：一： v-if: 控制DOM元素的显示隐藏是将DOM元素整个添加或删除;v-show: 控制DOM 的显示隐藏是为DOM元素添加css的样式display，设置none或者是block，DOM元素是还存在的...

理解这个问题，我们先看一个报错警告说明：返回的data应该是一个函数在每一个组件实例中我们继续看：在vue实例上data定义的是一个对象，也可以是一个函数：var app = new Vue({ el:"#app", // 对象格式 data:{ foo:"foo" }, // 函数格式 data(){ return { foo:"foo" } }})但是在vue

vue常用指令：v-model 多用于表单元素实现双向数据绑定v-for 格式： v-for="（item,index) in/of 数组json" 循环数组或jsonv-show 显示内容 ,通过display=block/none来控制元素隐藏出现v-if 显示与隐藏 （dom元素的删除添加 同angular中的ng-if 默认值为false）v-else-if 必须和v-if连用v-else 必须和v-if连用 不能单独使用 否则报错 模板编译错误v-bind 动态绑定 作用： 及时对

VUE中的几种组件传参方式对于vue来说常见的就是兄弟传值，父子传值1.父传子在父组件中定义数据，子组件通过props接收父组件传递的数据加以使用父组件中 <div class="box"> <p>这是父组件</p> <son :list="list"></son> </div>子组件中 props:['list'], //接收到父组件数据

js中的数据类型基本数据类型：Number、String、Boolean、Undefined、Null、Symbol（es6新增独一无二的值）和BigInt（es10新增）引用数据类型:Object。包含Object、Array、 function、Date、RegExp(正则)。备注：基本数据类型，又称值类型。js数据类型判断有以下几种判断方法：typeof、instanceof、constructor、Object.prototype.toString.call()...