Bambi98的博客

原创 自定义指令&混入mixin&过度和动画

文章目录vue列表循环非响应式情况自定义指令自定义插件过渡和动画vue列表循环非响应式情况数组的length无法响应处理手段： 使用 arr = null arr.splice( 0 )当你利用索引直接设置一个数组项时，例如：vm.items[indexOfItem] = newValue处理手段: Vue.set / this.$set自定义指令内置指...

原创 slot插槽和组件的生命周期

文章目录slot 插槽组件的生命周期slot 插槽作用 ： 开辟一个空间，给未来的元素使用未来的元素：组件的内容组件的生命周期为什么要使用生命周期？我们想要使用组件，那么就得在组件的特定阶段完成特定的任务【特定时间点，完成特定任务】名词： 钩子特定时间点，触发的一个方法组件的生命周期分为三个阶段：初始化、运行中、销毁 8个钩子函数生...

原创 Vue子父通信流程

子父通信流程先在子组件中定义一个数据在父组件中定义一个数据，这个数据用来接收子组件传递过来的数据在父组件中定义一个事件处理程序，用于改变父组件定义的数据，这个事件处理程序是有参数的，这个参数就是子组件传递过来的数据将这个事件处理程序通过事件绑定的形式绑定在子组件身上、在子组件中定义一个事件处理程序，这事件处理程序中通过 this.$emit来触发自定义事件，并传递一个参...

原创 关于一部分的Vue组件

Vue组件Vue组件Vue组件Vue有两大核心内容指令组件什么是组件化？为了避免多人开发造成的冲突为了加快开发效率为了便利更新和维护组件化：就是使用具有独立公共的一个整体【组件】来进行项目开发的一个趋势【流行】什么是组件组件是一个html css js img 等的一个整体在Vue中使用了一个叫做单间文件组件的技术来实现组件它是一个 xxx.vue...

原创 深入响应式原理

转载 虚拟DOM和diff算法

虚拟DOM和diff算法**虚拟DOM是在DOM的基础上在内存建立了一个抽象层，对数据和状态所做的任何改动，都会被自动且高效的同步到虚拟DOM，最后再批量同步到DOM中****传统DOM操作和虚拟DOM操作的区别：**【传统DOM操作(例如:innerHtml)】：render html => 重建所有DOM元素【虚拟DOM】：render 虚拟DOM + diff算法 =>...

转载 深入Vue2.x的虚拟DOM diff原理

深入Vue2.x的虚拟DOM diff原理一、前言二、例子三、简单的diff四、Vue的diff实现（一）、优先处理特殊场景（二）、“原地复用”五、按步解剖实例（一）、整体视图（二）、逐步解析作者简介：汪玉林，高级工程师，增值产品部前端Leader，目前团队负责手Q游戏中心、手Q游戏运营、手Q阅读等项目，有丰富的Web前端架构经验。一、前言Vue的核心是双向绑定和虚拟DOM（下文我们简称为v...

原创 Vue的一些指令 以及computed、watch

Vue指令v-bind: 单向的数据绑定v-model: 双向的数据绑定例子: 使用单向数据绑定实现双向事件绑定v-on修饰符computed（计算属性）watchv-bind: 单向的数据绑定<input type="text" v-bind:value = "msg"> <!-- 简写 --> <input type="text" :va...

原创 关于一部分express项目改造

express项目改造MVCmvc:M(数据分离），V（视图），C（逻辑）控制器1.建立项目 express -e mongoose_demo 安装项目依赖 npm i2.建立路由文件 routes/position.js1.路由模块中只有路由功能2.在路由模块中导入controller.js控制器模块，将请求方式 req，res，next参数传递到控制器 执行const posi...

原创 关于前端通信以及实现聊天室的通信

文章目录前端通信1.Node中的net模块提供的前端通信2.H5提供的webSocket （主流）3.pc端低版本浏览器使用的socket io（很少使用）4.通信- 服务端:总的服务器 （腾讯的qq服务器 一个整体）- 客户端: 单个用户使用的应用 （个人的QQ）案例（聊天室的简单通信）- 搭建静态的服务器- 搭建通信服务器- 搭建通信的客户端- 通信聊天室的简单结构前端通信1.Nod...

原创 关于前端async

文章目录自定义包上传npmjs记住要发送的邮箱激活切换你的npm源你的包的名称不要和别人的重复步骤1.登陆npm账号npm adduser2.上传npm publishnode后端路由的基本原理后端路由其实就是一个web服务器路由:以前:多页面index.htmla标签 herf = “./detail.html”a标签 herf = “./shopcar.html”现在流行:单页面index.h...

原创 关于Stream流

文章目录Stream流什么是流？ Node中为什么要有流这个概念？ 使用场景？流指的是数据流，指的是数据是分片传输的gulp 【流试操作】案例const fs = require('fs')引入读取文件const zlib =require('zlib')引入压缩包const inp =fs.createReadStream('路径')读取数据const gzip = zlib.createGzi...

原创 如何安装nvm--Nodejs--nrm--gulp--nodemon监听

文章目录一、安装nvm1.nvm安装前需要卸载原来的Node.js2.下载nvm并安装-安装路径不要有中文，有中文可以安装，但是无法使用，需要卸载重新装，如果电脑账户名有中文则可以安装到D盘，不会影响Node.js3.更改nvm文件夹内settings.txt路径：最好是默认的根据自己电脑查找users是自己的电脑用户名 在你安装的目录下找到settings.txt文件，打开后加上 node_mi...