- 博客(34)
- 收藏
- 关注
原创 两种解决方案vscode安装依赖总是失败
微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载[1]两种解决方案vscode安装依赖总是失败vue项目npm install时总是报没有权限的错误,具体错误如下图如果项目中遇到这个错误,我们有两种解决方案方案一:只提供临时解决npm install 安装依赖没有权限报错,想彻底解决可直接翻看方案二右键前端开发工具,选择以管理员身份运行,然后再安装依赖就可以了,缺点是每次打开前端开发工具都要进行此步骤,比较...
2022-02-25 15:45:50
14880
原创 多接口同时调用 propmise.all
propmise.all 微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载最近工作过程中,要同时调用几个有关联的接口,发现了一个非常好用的方法 Promise.all1.官方解释Promise.allPromise.all(iterable) 方法返回一个 Promise 实例,此实例在 iterable 参数内所有的 promise 都“完成(resolved)”或参数中不包含 promise 时回调完成(res
2020-11-25 11:17:46
1181
原创 纯JavaScript编写的图表库—Highcharts
纯JavaScript编写的图表库—Highcharts 微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载Highcharts简介Highcharts 是一个用纯JavaScript编写的一个图表库,能够很简单便捷的在web网站或是web应用程序添加有交互性的图表,Highcharts 免费提供给个人学习、个人网站和非商业用途使用。HighCharts支持的图表类型:曲线图、区域图、饼图、散点图、气泡图、动态图表、组
2020-09-28 14:12:16
846
原创 表格数据显示格式设置
微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载表格数据显示格式设置表格行数据需要有一个显示格式设置列,具体实现为通过下拉框设置数据的显示格式,如下图,下拉框可以根据输入或者选择的小数位,来筛选对应的下拉框选项内容,选择某一个选项后,所选数据的内容相应的存储至当前行数据的formatType变量中,在展示数据时,根据当前行formatType对应的显示格式来格式化数据,从而实现表格数据显示格式的设置,其中format.
2020-09-28 09:59:36
1014
原创 js特效 jQuery特效 网页特效网站 web网站模板下载推荐
微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载js特效 jQuery特效 网页特效网站 web网站模板下载推荐最近在做一个动画的需求,用的是html+css+js,所以在网上找了一些模板进行参考,今天整理分享出来,里面大部分网站是付费下载的,当然也有一些免费的,可能是因为实现的效果比较简单,也可以下载下来参考参考。1.js代码网https://www.jsdaima.com/Index/js/p/5.htm.
2020-09-24 17:07:36
1446
原创 element-ui 封装页面步骤导航定位条
element-ui 封装页面步骤导航定位条最近在用element-ui组件开发项目,项目页面中,由于页面比较长,所以页面右侧设计了步骤导航定位条,滚动页面后,右侧步骤条跟着滚动,并且右侧同步显示页面滚动到哪个模块上,查看了element-ui组件库,发现并没有现成的组件,所以自己封装了一个,便于项目中其它页面使用。 mounted() { window.addEventListen...
2020-04-20 16:49:59
1897
1
原创 使用 vue init webpack 或 vue init webpack-simple 创建vue工程后,使用ivew报错
使用 vue init webpack 或 vue init webpack-simple 创建vue工程后,使用ivew报错安装iviewnpm install view-design --save引入 ViewUI一般在 webpack 入口页面 main.js 中如下配置:import Vue from 'vue';import VueRouter from 'vue-rout...
2020-04-15 16:59:09
768
1
原创 webpack创建vue工程以后,运行项目控制台提示{ parser: “babylon” } is deprecated; we now treat it as { parser: “babel”}
{ parser: “babylon” } is deprecated; we now treat it as { parser: “babel” }webpack创建vue工程以后,运行项目后控制台提示{ parser: “babylon” } is deprecated; we now treat it as { parser: “babel” }.解决方法:找到工程里面文件夹node...
2020-04-15 16:50:44
695
原创 vue项目常见运行报错汇总
vue项目运行报错汇总1.npm install报错:no such file or directory, open ‘D:\practice\node\package.json’解决方法:先执行:npm init -f然后在安装,安装的时候后面加上–savenpm install --save如果执行上部操作后还是继续报错,则继续执行npm init -f一直这么循环,直到n...
2020-04-15 16:44:29
4936
原创 github上下载了一个vue项目,运行提示webpack: Failed to compile
在github上下载了一个vue项目,运行提示webpack: Failed to compile.按照步骤,先执行了npm install ,结果,执行失败,报错一堆404解决方法:npm install -g cnpm --registry=https://registry.npm.taobao.org然后运行项目,npm run dev 又报错一大堆,如下:根据提示安装 np...
2020-04-15 15:58:42
4633
3
原创 vue常见报错: e.call is not a function
vue报错: e.call is not a function如图:控制台虽然报错但是页面可以正常访问,百度提示‘生命周期钩子函数 是否有 声明了未定义方法 或是 只声名了钩子函数’查看代码果然之声明了但里面没有定义方法如图:解决方法:删掉图中的created()即可,虽然不影响页面,但是如果不解决的话可能会给后面挖坑,所以还是在趁早解决比较好...
2020-04-15 15:54:50
2161
原创 动态增行删行操作
动态增行删行操作如下图所示,默认只展示一行,右侧有删除和添加按钮,点击删除删除当前行,点击添加在当前行下面添加新的一行默认:添加两行以后:删除一行以后主要是通过id拿到整体的div,在div后面进行添加代码如下:html<div class="layui-form-item dividingLine"> <label class="l...
2020-04-15 15:40:36
603
原创 vue项目安装到启动
微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载vue简介Vue是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全...
2020-01-13 17:49:03
371
原创 css代码检查工具--cssLint
微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载css代码检查工具–cssLintcssLint简介CSSLint 能线上分析并检测你的网站 CSS 样式表有无任何潜在问题,使用方法很简单,只需要把 CSS 内容复制贴上,最后按下 LINT!按钮就可以检查。底下有一些设定项目可以调整检测的项目和规则,预...
2020-01-09 18:13:41
1811
原创 JavaScript验证工具JSLint
微信公众号:前端程序猿之路关注可了解更多的前端知识,反馈问题或建议,请公众号留言。如果你觉得公众号内容对你有帮助,欢迎关注并转载官网链接官网链接:http://www.jslint.com/jslintjslint文档:http://www.jslint.com/lint.htmljslint简介上一篇讲了csslint ,除了cssLint网站,也有jslint网站,只需要把J...
2020-01-08 09:36:02
309
原创 运行github vue项目报错解决总结
运行github vue项目报错解决总结在github上下载了一个vue项目,运行提示webpack: Failed to compile.按照步骤,先执行了npm install ,结果,执行失败,报错一堆404解决方法:npm install -g cnpm --registry=https://registry.npm.taobao.org然后运行项目,npm run dev 又报错...
2019-12-31 15:48:41
690
原创 vue报错: e.call is not a function
vue报错: e.call is not a function如图:控制台虽然报错但是页面可以正常访问,百度提示‘生命周期钩子函数 是否有 声明了未定义方法 或是 只声名了钩子函数’查看代码果然之声明了但里面没有定义方法如图:解决方法:删掉图中的created()即可,虽然不影响页面,但是如果不解决的话可能会给后面挖坑,所以还是在趁早解决比较好参考链接:https://blog....
2019-12-31 15:45:48
1442
原创 前端UI框架总结
前端UI框架总结 原文 请关注前端程序猿之路公众号1.Vue.jsVue.js是一套构建用户界面的渐进式框架。与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合。另一方面,Vue 完全有能力驱动采用单文件组件和Vue生态系统支持的库开发的复杂单页应用。官网:https://cn.vuejs.o...
2019-12-27 10:12:56
533
原创 vue如何封装一个组件
vue如何封装一个组件1.新增子组件在工程src->components目录下新建一个文件夹用于存放组件。我封装了一个树组件,文件夹名称为va-tree,里面有一个va-tree.vue文件,写了树组件的具体内容,包括组件样式、组件处理逻辑、组件模板等等子组件中定义的props是父组件需要传给子组件的数据,在子组件中props里面定义名称和类型下图中:data是树组件展示的数据,...
2019-12-26 14:46:07
7073
1
原创 vue仿iview穿梭框组件
vue仿iview穿梭框组件穿梭框中左侧为源数据,右侧为目标数据,其中左侧包含右侧全部数据,右侧可增加或减少,也可单选或者多选,也可选择数据然后上下移动展示顺序。之前参考了iview穿梭框,但是其现有的功能不能满足需求,所以自己重新写了一个穿梭框,在原有的基础上功能上新增了做了一些修改和调整,还有很多不足之处,仅供参考功能:1. 左侧数据穿梭到右侧,左侧数据不减少,右侧数据增加2. 右侧...
2019-12-26 14:45:46
2207
2
原创 封装一个多功能树组件&快捷键操作树
封装一个多功能树组件&快捷键操作树基础功能使用了element-ui里面的树组件,可单选多选节点…新增功能1. ctrl+鼠标右键,选中当前树节点的第一级子节点2. shift+鼠标右键,控制当前单个节点的选中和取消树组件内容如下:<template> <div> <el-tree @check="handleChe...
2019-12-12 15:55:27
254
原创 JSON.parse(JSON.stringify(data )) 报错
JSON.parse(JSON.stringify(data )) 报错Unexpected token o in JSON at position 1或者Unexpected token o in JSON at position 0JSON.stringify()方法是将对象或者数组转换为一个 JSON字符串。JSON.parse()方法用于将一个 JSON 字符串转换为对象。(1)如...
2019-12-10 18:23:34
2798
原创 vue给数组中对象排序 sort函数
vue给数组中对象排序 sort函数开发穿梭框的时候,需要将左侧选中的数据排序后添加到右侧先看代码吧,后面解释originalData为左侧选择的数据:var originalData =[{name: 'Tom'},{name: 'Andy'},{name: 'Marry'},{name: 'Tina'}];先给每个对象添加一个排序order:for (let i = 0; i ...
2019-12-06 18:29:45
13808
原创 vue中this.$nextTick()的使用
vue中this.$nextTick()的使用this.$nextTick()是在页面渲染以后再调用里面的动作例如:<div id="app"> <h1 id="title">{{content}}</h1> <button @click="click">点击</button></div><script...
2019-12-05 11:12:11
537
原创 前端return 返回多个值应如何处理
前端return 返回多个值应如何处理1.通过返回一个对象,对象中有多个值count () { return { originalCount: this.originalData.length, targetCount: this.targetData.length } ...
2019-12-02 17:42:29
3249
原创 使用map优化for循环
使用map优化for循环之前做的一个东西是点击一键升级按钮,修改后台返回的json数据里面某个对应的key:value值,没有优化钱使用了for循环完成,优化后使用map完成,因为for循环随着json数据的多少循环的次数不断增加,效率比较低,后面用了map直接进行了替换,简单了代码也优化了效率没有优化前:upGrade() { let contentData = JSON....
2019-11-28 11:19:09
865
原创 vue中对iview树每个节点增加复制粘贴功能
vue中对iview树每个节点增加复制粘贴功能需求:在每个树节点后面都添加一个‘复制标识’,鼠标移入当前行后当前行显示‘复制标识’,点击复制标识对当前树节点的标识进行复制并提示是否复制成功,点击鼠标右键进行粘贴效果图:· 代码:因为树用的是iview里面的树组件,要想在树节点后面添加‘复制标识’必须通过render函数给每个节点添加span标签,添加标签以后在里面写moseover,m...
2019-11-28 11:16:22
1035
原创 Vue解决父子组件传值,子组件改变值后父组件的值也改变的问题
Vue解决父子组件传值,子组件改变值后父组件的值也改变的问题 vue开发过程中,父组件通过props传值给子组件,子组件在页面展示父组件的值,在操作子组件值以后,即使不点击确定按钮,父组件中的值也发生了变化,但是需求是操作子组件数据以后,必须点击'确定'按钮以后才能修改父组件的值,否则父组件和子组件的值都不可以变化。 为了解决这一问题,当父组件传值给子组件以后,我通过 JSO...
2019-11-28 11:02:04
7383
25
原创 vue封装修改后的modal对话框
vue封装修改后的modal对话框iview里面Modal对话框有两种,一种是普通对话框,如下图:另一种是消息对话框,包括消息对话框、成功对话框、警告对话框、错误对话框、确认对话框,这几种对话框根据消息的类型来展示左上角的图标显示,如下图是消息对话框:很明显的可以看出,第一种和第二种对话框样式完全不同,普通的对话框并没有左上角的图标,在开发过程中,发现当第二种对话框需要连续显示两次的时候...
2019-11-27 17:55:27
2895
原创 vue使用iview或者element-ui组件修改样式不生效解决方法
vue使用iview或者element-ui组件修改样式不生效解决方法1.样式如果定义为<style lang="less" scoped></style>使用 &/deep/来修改组件的样式在引用的组件外面套一层div,在div中定义一个class,例如class=“desinger”修改样式时如下操作即可:添加&/deep/2.样式如果没有定...
2019-11-26 15:40:33
1649
原创 vue开发过程中数组新push一个对象,其他对象同时被修改
vue开发过程中数组新push一个对象,其他对象同时被修改 this.targetData.push(item) vue开发数组push一条对象而导致之前push进去的对象也变成后面进去对象的值,百度发现原因是对象 是引用类型,传递的是引用地址,所以两个数组引用的是同一个对象,只要其中一个数组改变,就会导 致对象改变,进而另一个引用的数组也会改。 解决方法:将需要放入数组的对象先深...
2019-11-26 14:56:45
4108
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人