Vue
文章平均质量分 66
殿君不是殿军
这个作者很懒,什么都没留下…
展开
-
当使用elementUIDateTimePicker 日期时间选择器组件的时候,想要显示当前时间 和 禁用当前时间之前的日期
default-time接受一个数组,数组每项值为字符串,形如12:00:00,其中第一项控制起始日期的具体时刻,第二项控制结束日期的具体时刻。参照element ui的官方文档可以使用里面的picker-options属性和disabledDate(设置禁用状态,参数为当前日期,要求返回 Boolean)当使用elementUIDateTimePicker 日期时间选择器组件的时候,想要显示当前时间 和 禁用当前时间之前的日期。JavaScript getTime()方法。使用moment插件。...原创 2022-08-26 12:49:40 · 3170 阅读 · 1 评论 -
模拟Vue3响应式原理
代码】模拟Vue3响应式原理。原创 2022-07-30 23:18:42 · 360 阅读 · 0 评论 -
路由传参的方式?查询参数和动态参数传递和获取?
一、使用router-link进行路由导航,传递参数二、通过路由属性中的name来确定匹配的路由,通过params来传递参数父组件中:使用name来匹配路由子组件中:使用接收参数三、使用path来匹配路由,然后通过query来传递参数,这种情况下 query传递的参数会显示在url后面?id=?父组件中:使用query传递参数子组件中:使用来接收参数注意:总结:...原创 2022-07-13 19:45:37 · 1625 阅读 · 0 评论 -
token的主动介入和失效的被动是怎么处理的?(token失效/超时处理)
主要在请求拦截器中操作:主要在响应拦截器中操作:原创 2022-07-10 21:11:02 · 1311 阅读 · 1 评论 -
前端面试题大全(二)持续更新中
什么情况下,数组或者对象的数据产生变动, 视图不更新? 解决方案是什么?(2种)虚拟DOM是什么?diff算法如何比较新旧虚拟DOM(从根元素说起)?v-for的key值有什么讲究?作用是什么?key用index可能会造成数据错乱v-model的本质是什么?[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-PJwXSSyr-1657205243563)(C:\Users\lenovo\Desktop\课堂面试题\assets\1657192193193.png)]原创 2022-07-07 22:49:47 · 669 阅读 · 3 评论 -
前端主流面试官必问超详细面试题(整理完以秃头)持续更新中
CDN利用最靠近每位用户的服务器,更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户,来提供高性能、可扩展性及低成本的网络内容传递给用户。CDN的作用:(1)在性能方面,引入CDN的作用在于:(2)在安全方面,CDN有助于防御DDoS网络攻击:懒加载也叫做延迟加载、按需加载,指的是在长网页中延迟加载图片数据,是一种较好的网页性能优化的方式。 比如:在较长的网页中。如果有很多图片,所有的图片都被加载出来,而用户只能看到可视窗口的那一部分图片数据,这样就浪费了性能。如果我们使用图片的懒加载就可以解决原创 2022-07-07 23:03:46 · 4065 阅读 · 1 评论 -
解决报错Uncaught (in promise) NavigationDuplicated {_name: “NavigationDuplicated“, name: “NavigationDupl
解决报错Uncaught (in promise) NavigationDuplicated {_name: “NavigationDuplicated”, name: “NavigationDuplicated”}先上一下报错的截图:介绍一下解决方式:在router目录下的index.js文件中加入如下代码:这样就解决了。。。。...原创 2022-07-07 08:57:08 · 650 阅读 · 0 评论 -
前端综合面试题一(持续更新)
Set具有以下方法:创建了一个新数组,新数组中是符合条件的所有元素查询数组中元素是否都满足要求,都满足则返回true,否则返回false查询数组中是否有元素满足要求,有满足则返回true并且不再往下执行,否则返回false扁平化数组,例如将二维数组转换成一维数组,三维数组转成一维二维数组。接受一个参数,不传入默认是1,表示拉平的层数。let关键字用来声明变量,使用 let声明的变量有几个特点:const 关键字用来声明常量, const声明有以下特点:ES6允许按照一定模式,从数组和对象中提取值,对变量进行原创 2022-07-01 20:21:36 · 1504 阅读 · 0 评论 -
Vue双向数据绑定的原理(前端面试必问)
Vue实现双向数据绑定是采用数据劫持和发布者-订阅者模式。数据劫持是利用ES5的方法来劫持每个属性的getter和setter,在数据变动时发布消息给订阅者,从而触发相应的回调来更新视图总之就是,在创建Vue实例的时候给传入的data进行数据劫持,同时视图编译的时候,对于使用到data中数据的地方进行创建Watcher对象,然后在数据劫持的getter中添加到发布者对象中,当劫持到数据发生变化的时候,就通过发布订阅模式以回调函数的方式通知所有观察者操作DOM进行更新,从而实现数据的双向绑定。通过直接调用o原创 2022-06-26 15:27:39 · 6085 阅读 · 0 评论 -
vue中的的diff算法(详解)
算法是一种通过同层的树节点进行比较的高效算法其有两个特点: 算法在很多场景下都有应用,在 中,作用于虚拟 渲染成真实 的新旧 节点比较整体策略为:深度优先,同层比较下面举个通过算法更新的例子:新旧节点如下图所示:第一次循环后,发现旧节点D与新节点D相同,直接复用旧节点D作为后的第一个真实节点,同时旧节点移动到C,新节点的 移动到了 C第二次循环后,同样是旧节点的末尾和新节点的开头(都是 C)相同,同理, 后创建了 C 的真实节点插入到第一次创建的 D 节点后面。同时旧节点的 移动到了 B,新节点原创 2022-06-24 11:12:32 · 938 阅读 · 0 评论 -
什么是SPA,如何实现SPA应用呢?
SPA(single-page application),翻译过来就是单页应用是一种网络应用程序或网站的模型,它通过动态重写当前页面来与用户交互,这种方法避免了页面之间切换打断用户体验在单页应用中,所有必要的代码(、和)都通过单个页面的加载而检索,或者根据需要(通常是为响应用户操作)动态装载适当的资源并添加到页面页面在任何时间点都不会重新加载,也不会将控制转移到其他页面举个例子来讲就是一个杯子,早上装的牛奶,中午装的是开水,晚上装的是茶,我们发现,变的始终是杯子里的内容,而杯子始终是那个杯子结构如下图我们熟原创 2022-06-19 14:06:38 · 1717 阅读 · 0 评论 -
对Vue中插槽-slot的详细解读
在HTML中 元素 ,作为 技术套件的一部分,是Web组件内的一个占位符该占位符可以在后期使用自己的标记语言填充举个栗子不会展示到页面中,需要用先获取它的引用,然后添加到中,在中的概念也是如此 艺名插槽,花名“占坑”,我们可以理解为在组件模板中占好了位置,当使用该组件标签时候,组件标签里面的内容就会自动填坑(替换组件模板中位置),作为承载分发内容的出口可以将其类比为插卡式的FC游戏机,游戏机暴露卡槽(插槽)让用户插入不同的游戏磁条(自定义内容)放张图感受一下通过插槽可以让用户可以拓展组件,去更好地原创 2022-06-18 16:38:42 · 272 阅读 · 0 评论 -
在Vue中我们怎么去使用长token(refresh_token)?
当用户发请求时,如果后端返回401,就说明token过期 这时我们要统一监测后端返回的401代码我们需要添加响应拦截器,在拦截器里的报错函数中监测判断token是否过期,代码如下:监测到401报错,就拿长token 发请求获取最新的token注意点:不能用request发,,因为request设置了请求拦截器,会注入老token (前提是自己封装了request)代码示例如下:接着用新token存到vuex中,存到本地存储,在js文件中不能用辅助函数 ,利用解构赋值覆盖旧token ,原创 2022-06-17 14:25:35 · 602 阅读 · 0 评论 -
Vue项目中你是如何解决跨域的呢?
开始之前,我们把组件间通信这个词进行拆分都知道组件是最强大的功能之一,中每一个我们都可以视之为一个组件通信指的是发送者通过某种媒体以某种格式来传递信息到收信者以达到某个目的。广义上,任何信息的交通都是通信组件间通信即指组件()通过某种方式来传递信息以达到某个目的举个栗子我们在使用框架中的组件,可能会往组件中传入某些数据,这个本质就形成了组件之间的通信在古代,人们通过驿站、飞鸽传书、烽火报警、符号、语言、眼神、触碰等方式进行信息传递,到了今天,随着科技水平的飞速发展,通信基本完全利用有线或无线电完成,相继出现原创 2022-06-16 21:56:28 · 383 阅读 · 0 评论 -
Vue组件之间的通信方式都有哪些?
开始之前,我们把组件间通信这个词进行拆分都知道组件是最强大的功能之一,中每一个我们都可以视之为一个组件通信指的是发送者通过某种媒体以某种格式来传递信息到收信者以达到某个目的。广义上,任何信息的交通都是通信组件间通信即指组件()通过某种方式来传递信息以达到某个目的举个栗子我们在使用框架中的组件,可能会往组件中传入某些数据,这个本质就形成了组件之间的通信在古代,人们通过驿站、飞鸽传书、烽火报警、符号、语言、眼神、触碰等方式进行信息传递,到了今天,随着科技水平的飞速发展,通信基本完全利用有线或无线电完成,相继出现原创 2022-06-15 17:50:32 · 374 阅读 · 2 评论 -
动态给vue的data添加一个新的属性时会发生什么?怎样解决?
我们从一个例子开始定义一个标签,通过指令进行遍历然后给标签绑定点击事件,我们预期点击按钮时,数据新增一个属性,界面也 新增一行实例化一个实例,定义属性和方法点击按钮,发现结果不及预期,数据虽然更新了(打印出了新属性),但页面并没有更新为什么产生上面的情况呢?下面来分析一下是用过实现数据响应式当我们访问属性或者设置值的时候都能够触发与但是我们为添加新属性的时候,却无法触发事件属性的拦截原因是一开始的属性被设成了响应式数据,而是后面新增的属性,并没有通过设置成响应式数据 不允许在已经创建的实例上动态添原创 2022-06-13 14:06:17 · 1383 阅读 · 0 评论 -
vue中实现路由跳转的三种方式(超详细整理)
步骤 (7步法 ):下载模块到当前工程在main.js中引入VueRouter函数添加到Vue.use()身上 – 注册全局RouterLink和RouterView组件创建路由规则数组 – 路径和组件名对应关系用规则生成路由对象把路由对象注入到new Vue实例中用作为挂载点, 切换不同的路由页面代码如下:2.在跳转路由时, 可以给路由对应的组件内传值在router-link上的to属性传值, 语法格式如下 :(方式一)对应页面组件接收传递过来的值(方式二)对应页原创 2022-06-12 10:33:36 · 98849 阅读 · 6 评论 -
路由跳转方式name 、 path 和传参方式params 、query的区别
$ router操作路由跳转$route读取 路由参数接收二、路由跳转方式name 、 path 和传参方式params 、query的区别通过params传参另一个页面接收:通过query传参另一个页面接收query相当于GET请求,页面跳转的时候,可以在地址栏看到请求参数params相当于POST请求,参数不会在地址栏中显示...原创 2022-06-12 08:37:19 · 3476 阅读 · 0 评论 -
前端面试题之Vue中data为什么必须是个函数?
vue中data必须是函数是为了保证组件的独立性和可复用性,data是一个函数,组件实例化的时候这个函数将会被调用,返回一个对象,计算机会给这个对象分配一个内存地址,你实例化几次,就分配几个内存地址,他们的地址都不一样,所以每个组件中的数据不会相互干扰,改变其中一个组件的状态,其它组件不变。...原创 2022-06-10 21:24:38 · 293 阅读 · 0 评论 -
什么是Vue,你对Vue的理解?
Web是World Wide Web的简称,中文译为万维网我们可以将它规划成如下的几个时代来进行理解石器时代指的就是我们的静态网页,可以欣赏一下1997的Apple官网最早的网页是没有数据库的,可以理解成就是一张可以在网络上浏览的报纸,直到CGI技术的出现通过 CGI Perl 运行一小段代码与数据库或文件系统进行交互,如当时的Google(1998年)ASP,JSP大家应该都不会太陌生,最早出现于 2005 年左右,先后出现了微软的 ASP 和 Java Server Pages [JSP] 等技术,取代原创 2022-06-10 13:58:29 · 1455 阅读 · 1 评论 -
双向数据绑定是什么
我们先从单向绑定切入单向绑定非常简单,就是把绑定到,当我们用代码更新时,就会自动更新双向绑定就很容易联想到了,在单向绑定的基础上,用户更新了,的数据也自动被更新了,这种情况就是双向绑定举个栗子当用户填写表单时,的状态就被更新了,如果此时可以自动更新的状态,那就相当于我们把和做了双向绑定关系图如下我们都知道 是数据双向绑定的框架,双向绑定由三个重要部分构成而上面的这个分层的架构方案,可以用一个专业术语进行称呼:这里的控制层的核心功能便是 “数据双向绑定” 。自然,我们只需弄懂它是什么,便可以进一步了解数据绑原创 2022-06-07 10:29:35 · 4370 阅读 · 0 评论 -
标题Vue解决子组件报错 error Unexpected mutation of “xxx” prop vue/no-mutating-props
这其实是vue 单项数据流的概念,这是Vue官方防止从子组件意外变更父级组件的状态内容,这样会导致你应用的数据流向杂乱无章。解决办法:修改后不仅要修改掉 v-model里的变量名即可 其他的也需要改掉这是我遇到的一个bug 也是很头疼的因为不能正常的操作 希望大家看到这边文章如果有更好的建议可以告诉我 谢谢!...原创 2022-06-05 09:03:01 · 2656 阅读 · 4 评论 -
你了解axios的原理吗?有看过它的源码吗?
关于的基本使用,上篇文章已经有所涉及,这里再稍微回顾下:发送请求请求拦截器响应拦截器取消请求二、实现一个简易版axios构建一个构造函数,核心代码为导出实例上述就已经能够实现这种方式的请求下面是来实现下这种形式的请求将上的方法搬运到上首先实现个工具类,实现将方法混入到,并且修改指向修改导出的方法构建拦截器的构造函数实现和执行语句和的时候,实现获取实例上的对象,然后再获取或拦截器,再执行对应的拦截器的方法把上的方法和属性搬到过去现在也有了对象,在发送请求的时候,会先获取拦截器的的方法原创 2022-06-02 19:16:02 · 268 阅读 · 0 评论 -
什么是Vue?什么是渐进式?什么是框架?
什么是Vue?原创 2022-05-31 21:31:31 · 248 阅读 · 0 评论 -
Vue项目中有封装过axios吗?主要是封装哪方面的?
面试官:Vue项目中有封装过axios吗?主要是封装哪方面的?一、axios是什么axios 是一个轻量的 HTTP客户端基于 XMLHttpRequest 服务来执行 HTTP 请求,支持丰富的配置,支持 Promise,支持浏览器端和 Node.js 端。自Vue2.0起,尤大宣布取消对 vue-resource 的官方推荐,转而推荐 axios。现在 axios 已经成为大部分 Vue 开发者的首选特性从浏览器中创建 XMLHttpRequests从 node.js 创建 http请求原创 2022-05-28 20:28:38 · 169 阅读 · 0 评论