qq_46178261的博客

为什么使用slot生活中：插槽的目的是让我们原来的设备具备更多的扩展性比如电脑的USB, 我们可以插入U盘，硬盘、手机、音响、鼠标、键盘等等组件的插槽：也是为了让我们封装的组件更加具有扩展性让使用者可以决定组件内部的一些内容到底展示什么插槽的基本使用显示效果：具名插槽的使用：需求：封装一个导航栏组件，左边、中间、右边都可根据需求显示不同的东西实现：<!-- 定义 --><template id="cpn"> <div&gt

Vue双向绑定实现原理及代码实现原理：Vue采用数据劫持结合发布者-订阅者模式的方法，通过Object.defineProperty()来劫持各个属性的setter,getter属性在数据变动的时候，通知订阅者，触发更新回调函数，重新渲染视图数据劫持（Object.defineProperty）当Vue实例上的 data 中的数据改变时，对应的视图所用到的 data中数据也会在页面改变。所以我们需要给 data 中的所有的数据设置一个监听器，监听 data 的改变和获取一但数据改变，监

Vue CLI、Vue Router、Vuex的使用1. vue-cli(vue脚手架)创建项目1.1 关于旧版本Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。1.2 Node 版本要求Vue CLI 4.x 需要 Node.js v8.9 或更高版本 (推荐 v10

Vuex核心概念vuex的五个核心概念1. StateState单一状态树Vuex提出使用单一状态树，什么是单一状态树呢？英文名称是：Single Source of Truth,也可以翻译成单一数据源也就是只能有一个Store对象,如果将状态信息保存在多个Store对象，之后管理会变得很困难单一状态树能够让我们用最直接的方式($store.state)找到某个状态的片段，而且便于之后的维护和调试2. Getters2.1 Getters基本使用有时候，我们需要从sto

Vue学习—2020/8/20传统工程问题兼容性问题使用模块化会导致JS文件增加，从而导致传输文件数增加直接使用原始代码会导致文件体积过大使用第三方库很不方便搜索下载引用js(某些第三方库可能没有ES6模块化版本)vue模板书写在字符串中，没有智能提示，没有代码着色难以把样式代码集成到vue组件中其他诸多细节问题…这些问题的本质是：开发的代码和运行的代码要求不同所以我们需要一个工具，然后通过这个工具转换后，得到一个最合适运行的代码在vue中，这个工具就是vue-cli

Vue学习—2020/8/19总结ES6知识补充ES6模块化没有模块化的影响：全局变量污染、难以管理的依赖常见的标准化标准：CommonJS、 ES6 Moudule、AMD、CMD、UMD…导出的几种方式：// 默认导出 {default: fn}， 函数可以是匿名函数export default function (a, b) { return a + b;}// 具名导出(普通导出)，一个js文件只能有一个默认导出，可以有多个普通导出// 普通导出, { double

Vue学习—2020/8/18总结ES6知识补充速写属性var name = "abc";var age = 18;var obj = { // 速写属性，当对象中的属性值来自于一个变量，可以简写为如下方式，等价于：name:name,age:age name, age}速写方法var obj = { name:"abc", // 速写方法，等价于sayHi:function() {...} sayHi() { con