随笔分类 - Vue_ relevant
Vue前端的相关问题
摘要：1.数据绑定,分2种: 1.1)初始化显示:页面(表达式/指令)能从data读取数据显示(编译/解析) 1.2)更新显示:更新data中的属性数据==>页面更新
阅读全文
摘要：1.数据绑定 一更新了data中的某个属性数据,所有界面上直接使用或间接使用了此属性的节点都会更新 2.数据劫持 1)数据劫持是vue中用来实现数据绑定的一种技术 2)基本思想:通过defineProperty()来监视data中所有属性(任意层次)数据的变化,一旦变化就去更新界面.
阅读全文
摘要：模板解析(3):一般指令解析 1) 得到指令名和指令值(表达式) 指令名:text/html/class 指令之:msg/myClass 2)从data中根据表达式得到对应的值 3)根据指令名确定需要操作元素节点的什么属性 *v-text textContent 属性 *v-html innerHT
阅读全文
摘要：指令解析,分两种: 1.事件指令; 2.一般指令; 04_模板解析_事件指令.html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>04_模板解析_事件指令_my</title></head><body><d
阅读全文
摘要：1.页面展示,03_模板解析_表达式_mvvm.html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>03_模板解析_表达式_vue</title></head><body><div id="test"> <
阅读全文
摘要：Vue中美元$符号的意思 vue的实例属性和方法 除了数据属性，Vue 实例还暴露了一些有用的实例属性与方法。它们都有前缀 $，以便与用户定义的属性区分开来。例如： var data = { a: 1 } var vm = new Vue({ el: '#example', data: data }
阅读全文
摘要：1.DOM节点是什么? 在网页中所有对象和内容都被称为节点，如文档、元素、文本、属性、注释等。节点（Node）是 DOM 最基本的单元，并派生出不同类型的节点，它们共同构成了文档的树形结构模型。 节点类型 根据 DOM 规范，整个文档是一个文档节点，每个标签是一个元素节点，元素包含的文本是文本节点，
阅读全文
摘要：模板解析 什么是模板? html嵌套了js代码 js代码以什么样的形式存在于页面代码中呢? 2种语法: 1)指令形式 2)表达式 模板解析 1. 模板解析的基本流程 1) 将 el 的所有子节点取出, 添加到一个新建的文档 fragment 对象中 2) 对 fragment 中的所有层次子节点递归
阅读全文
摘要：数据代理: 1) 数据代理:通过一个对象代理另一个对象(在前一个对象内部)中属性的操作(读/写) 如:a中包含[b, , , , ] (a代理b) a.b.xxx 代理: a.xxx (编码的时候操作的是a,本质是操作的a中的b) 2) vue数据代理:通过vm对象来代理data对象中所有属性的操作
阅读全文
摘要：查找各种方法上MDN:https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/ 准备知识: 1) [].slice.call(lis): 将伪数组转换为真数组 伪数组不是数组,是个对象;只是对象特性有length属性;还有下标属性(说白了,可以
阅读全文
摘要：说明: 1)分析vue作为一个MVVM框架的基本实现原理 数据代理 模板解析 数据绑定
阅读全文
摘要：编程式??? 假如有两个页面,A页面和B页面,要从A页面跳转到B页面,有两种做法: 法一:<a></a> 法二:无a标签,就是一个按钮; 加点击监听,通过js的方式,实现点击跳转 这就叫做编程式跳转. 编程就是你写js; 注意:写页面,写标签都不是编程 编程式路由导航:通过你写js代码,实现路由的跳
阅读全文
摘要：效果展示: 应写成下图这种形式: :id为占位 现在是通过什么路径向路由组件传递数据的? 通过请求参数${message.id}传递的 请求参数有两种: 1).Param 2).Query (?后面,类似于get) vue param和query两种传参方式 1、传参方式 query传参方式 thi
阅读全文
摘要：1. 错误原因: 修正页面显示: 原理解释: 在.vue文件中下面两种写法， 作用都是跳转到新的导航页，但是一种起效一种写法不起效，请问是什么原因???location.href = `${list.href}?index=${index}`location.href = '${list.href}
阅读全文
摘要：效果展示: 应写成下图这种形式: :id为占位 现在是通过什么路径向路由组件传递数据的? 通过请求参数${message.id}传递的 请求参数有两种: 1).Param 2).Query (?后面,类似于get) vue param和query两种传参方式 1、传参方式 query传参方式 thi
阅读全文
摘要：现在About切换后效果: 值不在了,说明About是个新的,要想值存在,About必须是个老的,旧的,被切换时死亡,在切换时重新创建; 要想不死亡,需要将它缓存起来,怎样缓存呢? <keep-alive> <router-view></router-view> </keep-alive> 缓存路由
阅读全文
摘要：嵌套路由:路由组件中又有路由链接 注意:需要根据效果去设计数据结构;(非常重要!!!!!!) 从图中判断红框为数组,数组里面的元素类型?观察一行有几个数据;图中为1个数据,为文本 数组内每一行既有文本又有链接,故为对象; 页面最终展示数据,message没有显示 原因排查: 1.F12看是否报错 没
阅读全文
摘要：如何判断一个对象是数组还是对象 一、typeof判断数据类型（判断数组跟对象都返回object） console.log(typeof null); // "object" console.log(typeof function () { return 1; }); // "function" co
阅读全文
摘要：左侧两个基本路由连接,右侧是路由组件显示部分;头部是固定的 注意: 现在流行SPA应用(单页应用:就有一个真实页面); 关键是承载的功能页面有很多,但是涉及到页面本身有很多变化,但是不能跳转; 这就引出路由连接,点击路有链接,不会向后台发送请求(如果发送请求,页面就跳转了); 只是更新显示不同的路由
阅读全文
摘要：“:” 是指令 “v-bind”的缩写，“@”是指令“v-on”的缩写；“.”是修饰符。详细如下 v-bind 指令可以用于响应式地更新 HTML 特性： <div id="app-2"> <span v-bind:title="message"> 鼠标悬停几秒钟查看此处动态绑定的提示信息！ </s
阅读全文
