vue
猿音
这个作者很懒,什么都没留下…
展开
-
js利用扁平化数组对象合并
在做一些项目时,会遇到一些表格数据的处理,穿梭框等数组对象的合并和去重操作,很多时候都是用两个循环来一个一个去判断,这样其实有个弊端时间和空消耗大,又做了很多重复的计算判断!在数据量比较小的时候可能觉得耗时不长,如果数据量大的话,就会有很明显的延迟。如果使用数组对象扁平化来做去重就比较简单接下来看需求//数组一 var List = [{ id: "1", pid: "0", name: "a", children: [{原创 2021-08-19 01:30:42 · 1017 阅读 · 1 评论 -
vue的报错 error Trailing spaces not allowed
启动vue项目的时候可能会遇到一些报错,但是这些报错并不会影响项目的启动,那么这些报错极有可能是eslint的问题,虽然不影响启动项目,但是这些报错在控制台对你排错带来一些干扰,所以要尽可能将错误处理掉类似这种,下面有提示的,只要按照他的提示做就可以了,就在他提示的文件最前面加一句 /* eslint-disable */这个就可以了例如这样改完之后就没有报错信息啦...原创 2021-07-27 00:03:18 · 712 阅读 · 0 评论 -
js数组去重
在项目时,遇到一些向表格添加数据的情况,都是需要考虑去重的。看一下例子当点击添加数据的时候会添加两条相同的数据,两条不同的数据。那么相同的数据就不应该添加进来,看看代码<template><div> <el-button type="primary" @click="add">添加数据</el-button> <el-table :data="tableData" stripe style="wi原创 2021-05-06 23:59:39 · 243 阅读 · 0 评论 -
使用vue搭建项目
使用vue搭建项目准备工作临时使用淘宝镜像。由于直接下载淘宝镜像会出现一些奇奇怪怪的bug,所以推荐临时使用淘宝镜像,提升下载速度npm --registry https://registry.npm.taobao.org install @vue/cli查看是否安装成功vue -V安装成功后,如果想在vue-cli3的环境运行vue-cli2的项目,要安装桥接工具npm i -g @vue/cli-init开始安装vue-cli2项目webStart项目原创 2020-10-19 22:40:09 · 128 阅读 · 0 评论 -
解决Computed property “name“ was assigned to but it has no setter.问题
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar原创 2020-09-09 12:28:59 · 27705 阅读 · 0 评论 -
Uncaught (in promise)报错原因和解决方法
在建Vue项目的过程中,可能会出现以下报错这时候别慌,可能你你的路由太少,甚至只有一个路由。在路由切换时路由重复点击所导致的错误,虽然这个错误不影响功能,但一般不要给它报错解决方法一,添加两个及以上的路由解决方法二,在你的路由代码中抛出错误就可以了this.$router.push("/").catch(()=>{});...原创 2020-05-28 01:03:56 · 43334 阅读 · 0 评论 -
掌握vue之绑定样式
绑定内联样式(style属性):做法: 将整个style属性,看作一个对象来绑定: 1). HTML中: <元素 :style="变量"> "css属性:值; css属性:值;..." 2).在 new Vue({ data:{ 变量:{ Css属性:值, Css属性:值, ... : ... } } })优点: 非常便于只修改其中某一个css属性!示例: 绑定sty原创 2020-05-20 15:16:56 · 126 阅读 · 0 评论 -
掌握vue指令之(11)v-model指令
123原创 2020-05-20 11:46:11 · 1128 阅读 · 0 评论 -
掌握vue指令之(10)v-pre指令
123原创 2020-05-20 11:09:17 · 195 阅读 · 0 评论 -
掌握vue指令之(9)v-once指令
(9)v-once指令问题:有些绑定只在首次加载时,修改一次。之后其他地方的修改,都不会影响这里的显示结果。如果一个元素之后不需要再更新,但是却占着虚拟DOM树中的一个位置,会影响虚拟DOM树的遍历速度!解决: 如果只在首次加载时显示,之后其他地方修改,这里都不会受影响的绑定,可用v-once绑定。写法:<元素 v-once>{{变量或js表达式}}></元素>原理: 只在首次渲染页面时,替换元素的绑定语法内容。但是不会将当前元素加入虚拟DOM树。结果: 只在首次加载一原创 2020-05-20 11:06:30 · 395 阅读 · 0 评论 -
掌握vue指令之(8)v-cloak和v-text指令
123原创 2020-05-20 09:42:06 · 294 阅读 · 0 评论 -
掌握vue指令之(7)v-html指令
123原创 2020-05-20 09:13:32 · 497 阅读 · 0 评论 -
掌握vue指令之(6)v-on指令
123原创 2020-05-20 01:14:38 · 190 阅读 · 0 评论 -
掌握Vue指令之(5)v-for指令
(5).v-for指令功能:根据数组中的内容反复生成多个相同结构的元素。用法:<要反复生成的元素 v-for="(value,i) of 数组/对象">注意:1.要反复生成的元素,只需要写一个当做模板即可!2. v-for一定要写在要反复生成的元素上,而不是要反复生成的元素的父元素上。3. v-for of,即可遍历数组,又可以遍历对象——统一了for in和for of强调:凡是用v-for时,必须同时绑定一个:key属性原因:因为v-for每次反复生成的元素之间除了内容原创 2020-05-20 00:23:18 · 1488 阅读 · 0 评论 -
掌握vue指令之(4)v-else-if指令
(4)v-else-if:功能:多个元素多选一显示写法:<元素1 v-if=“返回bool值的表达式”><元素2 v-else-if=“返回bool值的表达式”>… …<元素n v-else>注意:v-if、v-else-if和v-else多个元素必须紧挨着,中间不能插入其他元素。v-else后不要加任何,和程序中if else的else后不加表达式道理一样。例子:<!DOCTYPE html><html lan原创 2020-05-19 22:42:12 · 333 阅读 · 0 评论 -
掌握vue指令之(3)v-if和v-else指令
(3). v-if和v-else:功能:两个元素二选一显示语法:<元素1 v-if=“返回bool值的表达式”><元素2 v-else>注意:v-if和v-else两个元素必须紧挨着,中间不能插入其他元素v-else后不要加任何=,和程序中if else的else后不加表达式道理一样。v-show vs v-if 差别a. v-show通过display:none方式控制显示隐藏,因为不修改DOM树,所以效率略高b. v-if通过删除元素方式控制显示隐藏,所原创 2020-05-19 22:22:58 · 1458 阅读 · 0 评论 -
掌握vue指令之(2)v-show指令
(2).v-show:功能: 控制一个元素的显示隐藏 如何: <元素 v-show=“返回bool类型的js表达式”>原理:new vue()扫描到v-show时,就会先自动计算=后的js表达式的值,得到一个bool值。如果执行结果为true则,当前元素什么都不干,默认显示!如果执行结果为false则,当前元素自动添加display:none,隐藏。例子:<!DOCTYPE html><html lang="en"> <head>原创 2020-05-19 22:20:44 · 448 阅读 · 0 评论 -
掌握vue指令之(1)v-bind指令
12321原创 2020-05-19 22:18:06 · 191 阅读 · 0 评论 -
使用Object.defineProperties()模拟实现Vue的绑定原理
Vue的绑定原理Vue的绑定原理可以概括为:保护Data属性+观察这模式+新Dom树(虚拟)Vue的绑定原理可以参看Vue的绑定原理我们以下面的代码为例<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /&原创 2020-05-18 07:10:56 · 868 阅读 · 0 评论 -
vue的绑定原理
1231345原创 2020-05-17 11:46:01 · 708 阅读 · 0 评论