随笔分类 - vue
摘要：<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="wi
阅读全文
摘要：Vue监视数据的原理： 1. vue会监视data中所有层次的数据。 2. 如何监测对象中的数据？ 通过setter实现监视，且要在new Vue时就传入要监测的数据。 (1).对象中后追加的属性，Vue默认不做响应式处理 (2).如需给后添加的属性做响应式，请使用如下API： Vue.set(ta
阅读全文
摘要：1. 虚拟DOM中key的作用： key是虚拟DOM对象的标识，当数据发生变化时，Vue会根据【新数据】生成【新的虚拟DOM】, 随后Vue进行【新虚拟DOM】与【旧虚拟DOM】的差异比较，比较规则如下： 2.对比规则： (1).旧虚拟DOM中找到了与新虚拟DOM相同的key： ①.若虚拟DOM中内
阅读全文
摘要：MVVM模型 1. M：模型(Model) ：data中的数据 2. V：视图(View) ：模板代码 3. VM：视图模型(ViewModel)：Vue实例 观察发现： 1.data中所有的属性，最后都出现在了vm身上。 2.vm身上所有的属性 及 Vue原型上所有属性，在Vue模板中都可以直接使
阅读全文
摘要：Vue模板语法有2大类： 1.插值语法： 功能：用于解析标签体内容。 写法：{{xxx}}，xxx是js表达式，且可以直接读取到data中的所有属性。 2.指令语法： 功能：用于解析标签（包括：标签属性、标签体内容、绑定事件.....）。 举例：v-bind:href="xxx" 或 简写为 :hr
阅读全文
摘要：vue中有一个较为特殊的API，nextTick。根据官方文档的解释，它可以在DOM更新完毕之后执行一个回调，用法如下： // 修改数据 vm.msg = 'Hello' // DOM 还没有更新 Vue.nextTick(function () { // DOM 更新了 }) 尽管MVVM框架并不
阅读全文
摘要：1.vue中组件是用来复用的，为了防止data复用（同一个组件被复用多次会创建多个实例）。 2.vue组件中的data数据都应该是相互隔离，互不影响的，组件每复用一次，data数据就应该被复制一次，之后，当某一处复用的地方组件内data数据被改变时，其他复用地方组件的data数据不受影响，就需要通过
阅读全文
摘要：同域指页面URL的协议，端口号和host(document.domain)一样。 方法1:用 postMessage 两个页面需要如果存在如下两种关系之一，才可以用 postMessage 来传递数据。 关系1: 页面1 用 window.open 打开 页面2 关系2: 页面1 有 iframe，
阅读全文
摘要：区别watchwatch是监听一个值的变化，然后执行对应的回调；watch中的函数不需要调用；watch有两个参数；immediate：组件加载立即触发回调函数执行，deep: 深度监听，为了发现对象内部值的变化，复杂类型的数据时使用，例如数组中的对象内容的改变watch中的函数名称必须要和data
阅读全文
摘要：、keep-alive是什么keep-alive是一个抽象组件：它自身不会渲染一个DOM元素，也不会出现在父组件链中；使keep-alive包裹动态组件时，会缓存不活动的组件实例，而不是销毁它们。 一个场景用户在某个列表页面选择筛选条件过滤出一份数据列表，由列表页面进入数据详情页面，再返回该列表页面
阅读全文
摘要：手动懒加载--利用指令的概念 在 src 目录下，新建文件夹 directives，再其中新建 lazy.js： export default{ //这里的 el 就是使用了 v-lazy 指令的元素 mounted(el){ //保存图片地给 imgSrc const imgSrc = el.sr
阅读全文
