- 博客(14)
- 收藏
- 关注
RSS订阅原创 实践继承模式
组合继承优点：融合原型链继承和构造函数的优点，是 JavaScript 中最常用的继承模式。function Parent (name) { this.name = name; this.colors = ['red', 'blue', 'green'];}Parent.prototype.getName = function () { console.log(this.name)}function Child (name, age) { Parent.ca
2020-09-17 12:03:13
348
原创 双向绑定补充 （v-model）分析
v-mode最后实际上是在当前实例（el）上添加addAttr(el, ‘value’, (${value})) 相当于（el.prop）addHandler(el, event, code, null, true) （el. event）实际v-mode相当于读法糖最后生成代码描述："_c('div',[_c('input',{directives:[{name:"model",rawName:"v-model",value:(message),expression:"message"}],
2020-09-10 16:19:07
255
原创 响应式与双向绑定区别
有很多同学把双向绑定就等同于响应式 ， 其实是不对 的。在这里我们分析 一下 二者的区别：响应式：响应式 单身的 （数据流向视图）它是通过 Object.defineProperty（）实现的特别要指出的是 ， option.data 中的选项都会被响应式，都会有一个观察者目标（dep）实例 ， 但不是所有的选项都能被收集响应式 依赖，只有当你getter 才会去收集选项依赖， setter时 ， 派发依赖更新， 实际上为通知当前渲染watcher更新视图。双向绑定（v-model）
2020-09-09 15:13:13
4051
原创 依赖收集
首先 要所有 option.data都会被proxy,但 只有执行get的时候才会去收集依赖 ，且一个组件只有一个watcher ， 由于js是单线程，所以一个时刻只有一个watcher在执行那么vue 是怎么收集依赖的呢可以当页面执行 mountComponent的时候 ，触发Object.defineProperty的函数const dep = new Dep()一个option.data 选项会有一个dep 实例if (Dep.target) { dep.de
2020-09-05 18:20:44
570
原创 Eslint vetur prettier格式化
1.Eslint ： 代码质量检查vetur ： 高亮标记不同的代码prettier： 代码风格检查同时用Eslint 和 prettier 会出来配置冲突 ，要安装 "eslint-plugin-prettier": "^3.1.3",来解决备注: 要特别指出的是 ，如果用vue-cli 创建项目， 选择了Eslint + prettier ， 之后 在vscode 中不需要 再次安装网上好多 写的教程都再次安装 是错误 的 ， 而加重了冲突。...
2020-09-05 16:34:50
279
原创 vue2.x 是怎么让普通对象变为 响应式对象的呢
function initData (vm) { var data = vm.$options.data; data = vm._data = typeof data === 'function' ? getData(data, vm) : data || {}; if (!isPlainObject(data)) { data = {}; process.env.NODE_ENV !== 'production' && warn( .
2020-09-02 19:52:35
2145
原创 toRawType
/** * Get the raw type string of a value, e.g., [object Object]. */const _toString = Object.prototype.toStringexport function toRawType (value: any): string { return _toString.call(value).slice(8, -1)}尤大大 这个 方法 不能 区分普通对象和实例思考：普通对象和实例怎么区分...
2020-08-28 18:45:21
315
原创 javascript如何判断对象是否存在某属性
对于 一级的object 可用：inhasOwnProperty()那对于 多级 的思考呢：{ value: "zhinan", label: "指南", name: 'lxf', children: [ { value: "shejiyuanze", label: "设计原则", adress: 'mb',
2020-08-13 16:19:57
175
原创 关于环境变量在客户端能获取
development 模式用于 vue-cli-service serveproduction 模式用于 vue-cli-service build 和 vue-cli-service test:e2etest 模式用于 vue-cli-service test:unit关于.env , .env.development , .env.production 注意点：NODE_ENV 已经默认了变量必须 VUE_APP_XXX = XXX 形势.env , .env.developme
2020-08-13 11:13:18
108
原创 对象 路径
场景： {value: “zhinan”,label: “指南”,children: [{value: “shejiyuanze”,label: “设计原则”,children: [{value: “yizhi”,label: “一致”},{value: “fankui”,label: “反馈”},{value: “xiaolv”,label: “效率”},{value: “kekong”,label: “可控”}]},{value: “daohan
2020-07-30 16:27:43
147
原创 Vue CLI 3 可以使用 TypeScript 生成新工程
1. 如果没有安装 Vue CLI 就先安装npm install --global @vue/cli2. 创建一个新工程，并选择 “Manually select features (手动选择特性)” 选项vue create my-project-name
2020-07-11 18:19:48
175
原创 解决vue-cli3.0新建项目无法选中Manually select features
解决方法：按官网提示的 使用winpty vue.cmd create hello-world 命令创建项目，向下箭头选中Manually select features配置项，最后点击Enter会弹出可配置项。官网提示：如果你在 Windows 上通过 minTTY 使用 Git Bash，交互提示符并不工作。你必须通过 winpty vue.cmd create hello-world 启动这个命令。请参考vue-cli3...
2020-07-08 10:21:23
2805
原创 一直发送这个请求http://localhost:8080/sockjs-node/info?t=1534834909495;报失败是什么原因？
一直发送这个请求http://localhost:8080/sockjs-node/info?t=1534834909495;报失败是什么原因？热重载的问题node_modules\sockjs-client\dist\sockjs.jstry {//self.xhr.send(payload);} catch (e) {self.emit(‘finish’, 0, ‘’);self...
2020-04-28 21:59:55
2665
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人