- 博客(36)
- 收藏
- 关注
RSS订阅原创 window7系统中node版本的使用
window7系统安装node版本，使用：node-v13.14.0版本安装包下载地址：https://nodejs.org/en/download/releases/，下载该版本的安装包，高于该版本安装不上，低于该版本启动项目时，执行npm run serve命令时报错：npm ERR! XXX@10.1.0（项目名）serve: ‘vue-cli-service-serve’...
2022-05-09 20:00:36
477
原创 iView中Tab标签的层级问题
1、问题在使用iView中的Tab栏切换，同时将其他标签绝对定位在Tab标签的上面时，点击定位标签，不触发事件在选择标签右键检查，在浏览器调试工具中的Event Listeners中查看元素绑定的事件，取消Ancestors（祖先，原型，就是父标签），只查看选择的标签2、原因及解决办法因为tab组件的层级较高，在其他标签之上，所以点击不了其他标签，给其他标签在定位情况下提升层级，这样就可以点击了div{position:absolute;top:10px;left:10px;z-index
2021-11-14 16:45:27
605
原创 iView中的input文本输入框只允许输入4位数字，格式校验后再发送请求做别的校验
iView中的input文本输入框只允许输入4位数字的校验<template> <div> <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80"> <FormItem label="工号" prop="jobNumber"> <Input v-model="formValidate.jobNumbe
2021-11-14 16:20:06
2220
原创 父子组件通信学习经验记录
1、子传父：如果要想将子组件的数据和方法传递给父组件：方法1：一般是在触发子组件事件时，使用this.$emit()方法，触发父组件绑定在子组件使用标签身上的自定义事件，多级传递时，父组件和爷爷组件的自定义事件最好不要写一样的，在爷爷组件中可以用_自定义事件名来区别父亲和爷爷组件的自定义事件子组件click(){ this.$emit('update',数据)}父组件<son @update="update"/>methods:{ update(val){ this.$
2021-11-10 19:53:34
149
原创 父组件向子组件传值，父组件值更新，调用子组件方法，方法中拿到的还是旧值前端面试题（超详细）
1、问题父组件向子组件传值，父组件值更新，调用子组件方法，方法中拿到的还是旧值。2、原因在父组件值改变的方法中，修改传递给子组件的值，直接调用子组件的方法，此时，子组件的dom还未更新，需要等整个父组件（包含子组件）更新完毕后再调用子组件的方法。3、解决办法在父组件改变值的方法中使用this.nextTick(()=>｛this.nextTick(()=>｛this.nextTick(()=>｛this.refs.子组件使用标签身上ref的值.子组件的方法（）｝)，等整个组件D
2021-11-10 18:33:06
576
1
原创 图片和字体图标的加载器：url-loader和file-loader的使用及版本问题总结
1、问题在vue项目中，需要使用url-loader和 file-loader加载器对图片和字体图标进行解析，在此过程中们往往会出现诸如以下报错：（1）图片路径被渲染url([object Moudle])，导致图片和字体图标显示不出来（2）Uncaught Error: Module build failed (from ./node_modules/url-loader/index.js):TypeError [ERR_INVALID_ARG_TYPE]: The “id” argument m
2021-07-30 18:00:28
814
原创 TypeError: Cannot read property ‘nm‘ of undefined at Proxy.render
1、问题在做Vue项目时，控制台报错：TypeError: Cannot read property ‘nm’ of undefinednm是我从后台获取的json数据中的属性。2、原因nm未被定义，说明后台获取的json数据有问题，服务器正常响应，也能打印出响应数据，但里面提示：‘网络出错，请稍后重试’，后面查看Network,发现响应头Reqsponse Headers中 content-type: text/html; charset=utf-8,所以导致报错，不是application/js
2021-07-29 12:21:12
1218
原创 Uncaught Error: Module build failed (from ./node_modules/url-loader/index.js): TypeError [ERR_INVALI
1、问题使用字体图标时报错：Uncaught Error: Module build failed (from ./node_modules/url-loader/index.js):TypeError [ERR_INVALID_ARG_TYPE]: The “id” argument must be of type string. Received an instance of Object2、原因url-loader版本太低。3、解决办法卸载低版本，安装高版本。可以安装url-loader
2021-07-26 20:23:10
3281
1
原创 vue中图片路径渲染成：url([object Moudle])，图片和字体图标不显示的解决办法
1、问题在vue项目中，引入图片（背景图或img图片）.bg{display:inline-block;width: 43px;height: 14px;background: url(../../assets/maxs.png) 0 0 no-repeat; background-size: 43px 14px;margin-left: 5px;}最后图片路径被渲染url([object Moudle])。字体图标的引入方式正确，最后渲染到页面中却不显示。2、原因用于打包图片、字体图标文件的
2021-07-26 13:11:27
1209
1
原创 安装sass-loader时报错：Syntax Error: TypeError: this.getOptions is not a function
1、问题安装sass-loader时报错：Syntax Error: TypeError: this.getOptions is not a function2、原因安装的 sass-loader 版本太高，卸载安装低版本即可，同时注意安装sass-loader内置依赖node-sass的版本，保证二者版本兼容3、解决办法卸载高版本的sass-loader和node-sass，安装低版本且兼容的依赖npm uninstall --save sass-loader // 卸载npm i -D s
2021-07-24 19:21:31
1411
1
原创 使用npm install安装依赖时，报错npm ERR! cb() never called!
1、问题使用npm install安装依赖时，报如下错误：npm ERR! cb() never called!npm ERR! This is an error with npm itself. Please report this error at:npm ERR! <https://github.com/npm/npm/issues>npm ERR! A complete log of this run can be found in:npm ERR! C:\P
2021-07-24 18:06:19
1887
原创 vue build打包上线报错vue.min.js:6 Error: if there‘s nested data, rowKey is required.
1、问题使用Element-UI组件库el_table的扩展列时，在开发阶段没有报错，但在项目打包托管在服务器上后报错：vue.min.js:6 Error: if there’s nested data, rowKey is required.2、原因上述报错意思是：如果存在嵌套数据，则需要rowKey。在Element-UI 2.7.0中，在el-table标签中新增row-key字段，使用树结构时，属性row-key必须添加，而且私有数据中需要定义id，我们的项目中的el-table标签并
2021-06-30 19:33:34
566
原创 vue-cli 项目优化时报错 Uncaught TypeError: Cannot redefine property: $router
1、问题在优化vue-cli项目时，为了减少文件体积，采用cdn的方式加载了第三方的依赖。在vue.config.js中，在发布模式下配置externals节点：module.exports = { chainWebpack: config =>{ // 使用chainWebpack节点修改webpack默认的配置，当处于生产环境，获取默认的打包入口（main.js），清除，再通过add方法添加指定的入口文件 config.when(process.env.NODE_ENV
2021-06-29 20:52:02
1067
1
原创 [Vue warn]: Error in mounted hook: “TypeError: Cannot read property ‘init‘ of undefined“
1、问题在vue项目中使用echarts时报如下错误：2、原因echarts引入方式错误3、解决办法不使用import引入，使用require引入// import echarts from 'echarts'let echarts = require('echarts')
2021-06-28 19:47:49
1354
1
原创 element-ui中级联选择器添加验证规则时提示[“xxx is not a string“]
1、问题element-ui中级联选择器添加必填验证规则时，终端提示：[“xxx is not a string”]，且在选择选项之后还提示验证出错的信息2、原因因为级联选择器双向数据绑定的是选中项的id组成的数组，是一个数组，而验证规则中默认选择或输入的值是字符串。3、解决办法 goods_cat:[ // 表单验证规则中默认输入或选择的值是字符串，在这里可以指定输入或选择的值的类型 {type:'array',required:true,messag
2021-06-17 23:33:39
1812
1
原创 element-ui中input组件的autofocus属性失效问题
1、问题在vue项目中，使用element-ui中input组件的autofocus属性失效2、原因autofocus是vue中input的原生属性,element也支持这种方法,但是如果el-input组件外面还有其他组件, 就会导致autofocus失效。3、解决办法方法（1）：可在全局定义自动获得焦点的自定义指令，之后在所有单文件组件中都可使用v-focus使用该全局自定义指令，代码如下：a、在main.js中定义全局指令：Vue.directive('focus',{ in
2021-06-17 12:11:27
2396
原创 2.x版本的Element-ui的Cascader 级联选择器高度和内容显示错误
在使用Element-ui的Cascader 级联选择器组件的时候出现的问题以及解决办法。1、问题级联选择器的高度几乎占满了整个屏幕，且二级菜单无法正常显示。这个组件正常的展示效果是这样的：2、1.x和2.x版本Cascader 级联选择器官方示例代码对比以上错误是使用2.x版本的element-ui的cascader级联选择器时出现的错误，2.x版本的级联选择器的官方示例代码如下：<el-cascader v-model="value" :options="optio
2021-06-13 18:00:23
414
1
原创 Vue-cli@3.x使用图形界面创建vue项目并安装了less和less-loader开发依赖依然编译错误
1、问题：Vue-cli@3.x使用图形界面创建vue项目并安装了less和less-loader开发依赖依然编译错误2、原因：截止2021年6月2日，在图形界面中的依赖项安装的less-loader@9.0.0和它的依赖项less@4.1.1，二者不兼容，所以编译出错3、解决方案：在项目目录中打开Powershell终端，使用命令npm i less-loader@4 less@4 -D 安装俩依赖，然后重启项目即可。其他依赖兼容问题同上述解决方案...
2021-06-02 14:13:48
189
原创 在使用vue ui创建新项目时出现问题Cannot read property ‘indexOf’ of undefined
1、问题在使用vue ui创建新项目时出现问题Cannot read property ‘indexOf’ of undefined2、解决方案可能是vue-cli的版本太低了，先卸载vue-cli，npm uninstall -g @vue/cli，再安装 npm i -g @vue/cli@3.121，亲测vue/cli@3. 12.1可以正常使用。...
2021-05-30 23:51:51
1258
4
原创 webpack中使用less-loader加载器处理less文件的步骤
1、安装less-loader加载器运行命令：npm i style-loader css-loader less-loader@4 less@4 -D注意：less-loader依赖less，且他们之间有兼容问题，所以lee-loader的版本必须和less的版本相同或低于less的版本，否则报错。凡是插件（包）之间有依赖关系，依赖方的版本号（大版本）须同被依赖方或低于被依赖方，否则报错。如果依赖方版本高于被依赖方，依赖方中有的变量在被依赖方找不到，就会报错。2、在webpack.config.j
2021-05-28 12:47:43
1220
原创 html-webpack-plugin报错Cannot read property ‘tap‘ of undefined
1、报错：使用html-webpack-plugin时报错Cannot read property ‘tap’ of undefined2、解决方案：确保html-webpack-plugin的版本与webpack的版本一致（大版本一致即可），例如webpack用的是4,那么html-webpack-plugin版本也要是4或者低于4,否则就会出错。...
2021-05-27 18:40:46
2122
原创 webpack-dev-server的使用步骤
webpack-dev-server创建一个服务器（http://localhost:8080），服务器监听指定目录下的文件，自动打包文件，默认将输出文件bundle.js存于服务器的根目录中，并具有实时更新加载页面的功能，使用步骤如下：1、安装webpack@4.43.0 webpack-cli@3.3.12 webpack-dev-server@3.11.0（ webpack-dev-server的使用需要配合版本兼容的webpack和webpack-cli） ：npm i webpack@4.43
2021-05-27 15:25:32
7732
原创 js箭头函数对象返回值的简写
当箭头函数中返回值只有一个对象时，可以省略return，且在对象的外面加个小括号<script> var f = uname =>({uname: uname })</script>
2021-05-22 14:28:32
540
原创 Cannot find module ‘XXX‘的解决办法
解决方案：1、将node_module文件夹删掉2、输入命令：npm clean cache3、查看package.json里有没有依赖项，有的话npm install4、没有就npm install express --save
2021-05-19 20:17:08
1021
原创 vue调试工具vue-devtools安装及使用
https://chrome.pictureknow.com/extension?id=d50143a5f53d406dbe992277bfc905211、根据这个链接下载安装该vue调试工具，如在浏览器的右上角没有出现vue的这个图标，则按照教程再重新操作一遍。2、在浏览器的右上角"拼图碎片"图标 点击会看到vue图标的一个扩展程序3、图标呈现灰色，提示：Vue.js not detected信息（别慌，接下来就是解决问题咯）可以重新刷新一下，或重启一下浏览器如不行使用下面方法进行尝试。4、再次
2021-05-12 00:37:21
922
原创 [Vue warn]: Failed to resolve directive: modele (found in ＜Anonymous＞)
使用v-model对单行文本输入框做双向数据绑定时出现如上错误信息，是因为model打错了，打成了modele，将改成model即可。
2021-05-06 17:32:10
316
原创 vue中的事件修饰符及.prevent.self和.self.prevent的理解
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Do
2021-05-03 21:02:23
368
原创 oninput,onpropertychange和onchange的区别
oninput,onpropertychange,onchange的区别和用法：1、oninput,onpropertychange,onchange的用法l （1）onchange触发事件必须满足两个条件：a）当前对象属性改变，并且是由键盘或鼠标事件激发的（脚本触发无效）b）当前对象失去焦点(onblur)；（2）onpropertychange：只要当前对象属性发生改变，都会触发事件，但是它是IE专属的； （3）oninput是onpropertychange的非IE浏览器版本，支持
2021-04-13 10:37:05
493
原创 Refused to apply style from ‘http://localhost:3000/assets/bootstrap/dist/css/bootstrap.min.css‘
1、控制台报错：Refused to apply style from ‘http://localhost:3000/assets/bootstrap/dist/css/bootstrap.min.css’ because its MIME type (‘text/html’) is not a supported stylesheet MIME type, and strict MIME checking is enabled.2、解决办法：css文件引入路径错误，检查修改路径。...
2021-04-12 18:00:36
1595
原创 npm不支持node.js的解决办法
1、问题：今天在npm安装mime时，发现命令窗口报错,出现npm不支持node版本。npm WARN npm does not support Node.js v14.15.4npm WARN npm You should probably upgrade to a newer version of node as we can’t make any promises that npm will work with this versionnpm WARN npm Supported relea
2021-01-22 17:22:59
13909
原创 TypeError: Assignment to constant variable
TypeError: Assignment to constant variableconst声明常量，必须得赋值，且之后不可再修改其值，如果修改会报错，解决办法：将const修改为let
2021-01-22 12:00:26
479
原创 转载：在node环境下创建本地服务器出现Error [ERR_STREAM_WRITE_AFTER_END]: write after end错误
// 用于创建网站服务器的模块const http = require(‘http’)const url = require(‘url’)// appconst app = http.createServer()// 当客户端有请求来的时候app.on(‘request’, (req, res) => {res.writeHead(200,{‘content-type’:‘text/html;charset=utf8’,‘hello’:‘world’})console.log(r
2021-01-20 23:18:50
5013
1
原创 gulp4.0构建任务（一次执行多个任务）
执行default任务时，依次执行以下任务gulp.task(‘default’, [‘htmlmin’, ‘cssmin’, ‘jsmin’, ‘copy’]);报错：Task function must be specified改为：gulp.task(‘default’, gulp.series(‘htmlmin’, ‘cssmin’, ‘jsmin’, ‘copy’));...
2021-01-18 16:21:21
684
原创 转载：全局作用域中，用const和let声明的变量去哪了？
全局作用域中，用const和let声明的变量去哪了？用const和let声明的变量，不会存在window对象中大家都知道在全局作用域中用var声明的变量，保存在window对象中但是用ES6的const或者let在全局作用域中声明的变量，却不在window对象中那这个全局变量abcd被保存在哪里呢？经过我的寻找，终于在函数的内部属性[[Scopes]]中找到了，如下图如上图，在全局作用域中用const声明的变量在函数noop中可以正常访问，没有问题。我用dir方法打印出函数noop的属性，最后在[
2021-01-09 12:17:45
358
原创 es6新增字符串方法includes()方法
在开发中，经常会碰到判断一段字符串中是否包含某项字符的需求，用es5常用的方法通常是indexOf()去解决，例如 :var str = ‘这是测试字符串’;if(str.indexOf(‘测试’) != -1){console.log(true) //包含}else{console.log(false) //不包含}或者三目也可str.indexOf(‘测试’) != -1 ? console.log(true) : cosnole.log(false) ;而es6中新增
2020-12-25 16:02:58
307
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人