11 2022 档案
摘要：data() { return { tableData:[] } }, //原生JS+XLSX包实现 xls文件上传 methods: { //上传excel表格文件 uploadHandler(data){//对应的是 upload中的 => :http-request="uploadHandle
阅读全文
摘要：我在做一个页面其中有一个视频的播放，我开始用常规的思路去解决，我定义了一个一个控制视频播放的dialog和点击播放视频的开关，如何我发现当我点击开关的时候，dialog可以弹出，但不能播放视频，于是我就想是不是自动播放的问题，然后我就在视频的上面加了一个autoplay，然后我发现结果是视频可以播放
阅读全文
摘要：p { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; //多行在这里修改数字即可 overflow: hidden; /* autoprefixer: ignore ne
阅读全文
摘要：vue的双向绑定是由数据劫持结合发布者－订阅者模式实现的，那么什么是数据劫持？vue是如何进行数据劫持的？说白了就是通过Object.defineProperty()来劫持对象属性的setter和getter操作，在数据变动时做你想要做的事情 我们已经知道实现数据的双向绑定，首先要对数据进行劫持监听
阅读全文
摘要：1、问题描述：页面刷新的时候vuex里的数据会重新初始化，导致数据丢失。因为vuex里的数据是保存在运行内存中的，当页面刷新时，页面会重新加载vue实例，vuex里面的数据就会被重新赋值。 2、解决思路： 办法一：将vuex中的数据直接保存到浏览器缓存中（sessionStorage、localSt
阅读全文
摘要：1. hash 带#号的,history不带#号2.hash模式用的hashChange监听路径的变化3.history用的是HTML5相关的API语法 使用pushState => 添加一条历史记录 使用replaceState => 替换了一条历史记录 使用onpopState => 监听的前进
阅读全文
摘要：导航被触发。 在失活的组件里调用 beforeRouteLeave 守卫。 调用全局的 beforeEach 守卫。 在重用的组件里调用 beforeRouteUpdate 守卫(2.2+)。 在路由配置里调用 beforeEnter。 解析异步路由组件。 在被激活的组件里调用 beforeRout
阅读全文
摘要：在Vue中利用数据劫持defineProperty在原型prototype上初始化了一些getter,分别是router代表当前Router的实例 、 router代表当前Router的实例、router代表当前Router的实例、route 代表当前Router的信息。在install中也全局注册
阅读全文
摘要：TypeError: Cannot read properties of undefined (reading 'map') 原因：第一次页面渲染的时候，map的对象是undefined,所以在前面加个要进行判断，当有值时再去遍历 报错代码 解决方法一 ：后面加一个空数组 解决方法二：链式调用（?.
阅读全文
摘要：行内元素实现水平垂直居中： text-align: center;（text-align: center只能实现文本的垂直居中） line-height: 50px;（line-height不能实现多行文本的垂直居中） padding:50px;（不固定高度的垂直居中 通过设置padding实现）
阅读全文
摘要：什么是BFC: 块级格式化上下文 BFC的作用： BFC其实就是规定了网页布局的规范 1.BFC就是页面上的一个独立容器，容器里面的元素不会影响到外面的元素 解释:BFC的基本改变,最大的BFC是HTML文件 2.盒子垂直方向的距离由margin决定，属于同一个BFC的两个相邻盒子的margin会发
阅读全文
摘要：基线对齐（vertical-align : baseline）使元素的基线同基准元素（取行高最高的作为基准）的基线对齐顶端对齐（vertical-align : top）是将元素的行内框的顶端与行框的顶端对齐底端对齐（vertical-align : bottom）与顶端对齐（vertical-al
阅读全文
摘要：由于箭头函数不绑定this， 它会捕获其所在（即定义的位置）上下文的this值， 作为自己的this值 1. 所以 call() / apply() / bind() 方法对于箭头函数来说只是传入参数，对它的 this 毫无影响。 2. 考虑到 this 是词法层面上的，严格模式中与 this 相关
阅读全文
摘要：this 指向： 1. 全局上下文（函数外） 无论是否为严格模式，均指向全局对象。注意:严格模式下全局对象为undifined 2. 函数上下文（函数内） 默认的，指向函数的调用对象，且是最直接的调用对象： 简单调用，指向全局对象注意:严格模式下全局对象为undifined，某些浏览器未实现此标准也
阅读全文
摘要：单例模式：单例模式是指在内存中只会创建且仅创建一次对象的设计模式。在程序中多次使用同一个对象且作用相同时，为了防止频繁地创建对象使得内存飙升，单例模式可以让程序仅在内存中创建一个对象，让所有需要调用的地方都共享这一单例对象。 策略模式： 封装一组数据结构(算法),对外提供一个接口,策略模式 一般 用
阅读全文
摘要：this.$el this.$el DOM的根元素 => 是一个完全唯一的 $el 直到组件挂载完成 (mounted) 之前都会是 undefined。 对于单一根元素的组件，$el 将会指向该根元素。 this.$nestTick: 定义：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据
阅读全文
摘要：promise 内部有三个状态，分别是pending，fulfilled和rejected pending是对象创建后的初始状态，当调用resolve函数时变为fulfilled（成功）状态（可调用.then方法进行成功处理），当调用reject函数时变为rejected （失败）状态（可调用.ca
阅读全文
摘要：浅拷贝：如果拷贝的是一个基本数据类型则拷贝的是值，如果是引用数据类型则拷贝的是内存地址，一个改变其他另一个也跟着改变 常见的浅拷贝有：展开运算符，Object.assign()，Array.prototype.concat()，Array.prototype.slice()等 深拷贝：在计算机中开辟
阅读全文
摘要：scoped是一个样式作用域: 1. 可以让当前这个组件独享这个样式 2. 对子组件的根元素样式同样有效果 3. 对子组件的内部没有效果 原理: 当是我们scoped修饰style的时候,会对当前组件里面的元素(子组件的根元素)的样式添加一个 属性 => data-v-xxx 如果我们在父组件中想要
阅读全文
摘要：当我们在切换组件的时候,我们不想让这个组件被销毁(卸载),那么我们需要使用KeepAlive将组件给包裹起来 1. 在DOM模板当中,需要使用 <keep-alive> 进行包裹组件 2. 使用KeepAlive将组件包裹起来之后,该组件不会被销毁(卸载),而是将组件缓存起来了 KeepAlive的
阅读全文
摘要：props :父向子传递 $emit / v-on ：子向父（通过派发）传递v-model: 双向绑定slot:插槽（子组件通过插槽的方法传给父组件）provide/inject:依赖注入（可以指定传给后代的数据和方法）root：访问根目录的属性和方法$attrs/$listeners：深层传递（多
阅读全文
摘要：闭包产生的条件 1. 需要有一个不销毁的函数 2. 外部函数里面存在着一个直接或者间接的函数 3. 在内部函数当中需要引用(使用)到外部函数的局部(私有)的变量 闭包的特点: 1. 可以让外部作用域访问到函数内部(私有)作用域里面的变量 2. 闭包里面的变量会一直的存在内存当中,对于低版本IE浏览器
阅读全文
摘要：同步： 同步的思想是：所有的操作都做完，才返回给用户。这样用户在线等待的时间太长，给用户一种卡死了的感觉，但是程序还在执行。这种情况下，用户不能关闭界面，如果关闭了，程序就中断了。 异步： 将用户请求放入消息队列，并反馈给用户，系统迁移程序已经启动，你可以关闭浏览器了。然后程序再慢慢地去写入数据库去
阅读全文
摘要：宏任务 setTimeout setInterval setImmediate 微任务包括： process.nextTick 如果自己做不了老大,那么就重启开启一块队列,自己做老大 await上面的代码和后面的同步,下面的代码是微任务队列 MutationObserver Promise.then
阅读全文
摘要：Restful API: 1.CURD(增删改查) 由请求方式决定 2.请求方式有：get/post/delete/put 3.同一个路径可以进行多个操作 Restless API 1.CURD(增删改查) 不由请求方式决定 2.请求方式一般：get/post 3.一个路径对应一个操作 注意：API
阅读全文
摘要：正向代理：代理其实就是一个中介，A 和 B 本来可以直连，中间插入一个 C，C 就是中介。刚开始的时候，代理多数是帮助内网 client 访问外网 server 用的（我们使用谷歌翻外网） 反向代理：反向” 这个词在这儿的意思其实是指方向相反，即代理将来自外网客户端的请求转发到内网服务器，从外到内
阅读全文
摘要：数组扁平化 将一个多维数组编程一个一维数 函数柯理化 将一个函数的两个参数当中两个函数一个参数来进行执行 函数的作用: 将多个拥有相同功能代码封装在一起,让我们写代码变得少,变得简单 但是在有时候,封装函数的时候,并没有让我们的代码变得简单
阅读全文
摘要：所谓的同源策略是指，同域名、同协议、同端口。 所谓的跨域，不同的域名、协议、端口皆为不同域
阅读全文
摘要：1：通过服务端代理请求 2：第二种：jsonp跨域 3：CORS 跨域资源共享(xhr2) 4：nginx代理跨域
阅读全文
摘要：当一个组件被定义，data 必须声明为返回一个初始数据对象的函数，因为组件可能被用来创建多个实例。 如果 data 仍然是一个纯粹的对象，则所有的实例将共享引用同一个数据对象！通过提供 data 函数， 每次创建一个新实例后，我们能够调用 data 函数，从而返回初始数据的一个全新副本数据对象。 重
阅读全文
摘要：计算属性computed : 1. 支持缓存，只有依赖数据发生改变，才会重新进行计算 2. 不支持异步，当computed内有异步操作时无效，无法监听数据的变化 3.computed 属性值会默认走缓存，计算属性是基于它们的响应式依赖进行缓存的，也就是基于data中声明过或者父组件传递的props中
阅读全文
摘要：初始: beforeCreate created beforeMount =>挂载 --child beforeCreate --child created --child beforeMount --child mounted mounted 更新: beforeUpdate --child be
阅读全文
摘要：生命周期 => 重出生到死亡的一个过程 Vue也自己的生命周期 初始化阶段:执行一次 创建阶段 beforeCreate:创建之前 created:创建完成 偶尔使用 有一些程序员在这里发送请求 挂载阶段 beforeMount:挂载之前 mounted:挂载完成 经常使用 都在这里面发送请求 执行
阅读全文
摘要：问题: 当我们打开Vue页面的时候,如果弱网环境,会出现一个闪烁的效果 原因: Vue还来不及处理的模板 解决: 使用 v-cloak 来解决Vue这个打开页面的闪烁的问题 原理: 利用 v-cloak 这个指令使用 display:none 来进行隐藏 使用: 直接在app这个写一个 v-cloa
阅读全文
摘要：虚拟DOM 虚拟DOM的本质来说就是一个JS对象，Vue会把虚拟的DOM解析为JS的对象 还可以这样理解：虚拟DOM 本质上就是在 JS 和 DOM 之间做了一个缓存。可以类比 CPU 和硬盘，既然硬盘这么慢，我们就在它们之间加个缓存：既然 DOM 这么慢，我们 就在它们 JS 和 真实DOM 之间
阅读全文
摘要：1. Vue里面的key是一个特殊的变量,在元素当中是不体现出来的 2. 在解析成虚拟DOM的是,如果我们没有写key值,那么这个key就类似于下标 0 , 1 , 2 , 3.... 3. 使用列表渲染的时候,key必须是一个唯一的,key值是一定不会重复的 4. key值使用尽量不要使用下标 总
阅读全文
摘要：v-if的特点 v-if：是真实的条件控制语句，每当我们满足条件的时候就会显示元素，不满足条件的时候不显示元素(不存在元素没有) v-if：有一套自己的条件控制语句v-if; v-else-if; v-else v-if: 可以搭配Template标签使用 v-show的特点 v-show：也可以控
阅读全文
摘要：在Vue2中 v-for的优先级要高于v-if 在Vue3中 v-if 的优先级要高于v-for
阅读全文
摘要：Proxy的优势如下 1.Proxy 可以直接监听对象而不是属性(Object.defineProperty一次只能监视一个属性,如果要监视一个对象,那么需要遍历这个对象)，可以直接监听数组的变化(Object.defineProperty需要对7个核心数组进行重写才能监视数组) 2.Proxy 有
阅读全文
摘要：1. Vue2的响应式式原理主要是通过Object.defineProperty的方法里面的setter和getter方法的观察者模式来实现。也就是在组件的初始话阶段给每一个data属性都注册一个setter和getter，然后再new一个watcher对象，这个时候会立即调用组件里面的render
阅读全文
摘要：bug 一：在mounted钩子中轮播图等组件的封装问题 1.在Vue组件的封装中mounted中为什么执行了却拿不到数据 原因：mounted执行太快(一来就执行一遍)导致我们我们的dom后渲染解决方法：把我们要执行的代码变成watch监听的一个异步代码（this.$nextTick） 2.监听器
阅读全文
摘要：<template> <div id="app"> <ul> <li v-for="item in list" :key="item">{{item}}</li> </ul> </div> </template> <script> export default { data(){ return{ l
阅读全文
摘要：https://blog.csdn.net/m0_55854679/article/details/123028852
阅读全文
摘要：let ip = (req.headers['x-real-ip'] || req.connection.remoteAddress).slice(7);
阅读全文
