前端技术分享
婷婷心慌
这个作者很懒,什么都没留下…
展开
-
Uncaught TypeError: Cannot read properties of undefined (reading ‘install‘)报错,页面全空白的处理方法
vue页面Uncaught TypeError: Cannot read properties of undefined (reading ‘install’)报错,页面全空白。然后发现是自己写的指令全局引用的原因使用了export导出export { preventReClick }所以引用的时候不能import preventReClick from '@/directives'Vue.use(preventReClick)正确的应该是:import { preventReC原创 2022-05-13 17:11:13 · 38929 阅读 · 3 评论 -
Uncaught RangeError: Maximum call stack size exceeded.
当采用递归方式生成导航栏的子菜单时,菜单可以正常生成,但是当鼠标hover时,会出现循环调用某个(mouseenter)事件,导致最后报错。菜单溢出了。查看报错详情:处理方式1.给el-submenu添加一个属性:popper-append-to-body=“false”但是这种方式会导致popper-class属性不在body里面。将二级子菜单插入至body,这样做之后需要根据需要重新写样式2.给组件最外围添加一个div这是一个尝试,能够使子菜单大致正常使用,但是包裹之后,又需要给div原创 2022-05-13 15:34:22 · 843 阅读 · 1 评论 -
使用flv.js播放视频的时候,报错 _typeof is not defined
使用flv.js播放视频的时候,报错 _typeof is not defined。发现自己的版本是最新的:1.6.2考虑到版本过高导致的问题,就降低了版本:先把自己项目的flv.js卸载了npm unnstall flv.js然后安装对应的版本,选择了1.5.0的npm install flv.js@1.5.0启动项目之后就可以正常播放视频了。有时候自己本地的package.json文件是自己想要的插件版本号,但是还是不行????可能是下载的插件依赖依然不是自己想要的版本号,检原创 2022-01-24 16:18:11 · 3965 阅读 · 0 评论 -
gulp构建时报错 ReferenceError: primordials is not defined
执行npm run build时提示以下错误:ReferenceError: primordials is not defined问题的原因:是安装gulp版本与node版本不兼容的问题解决办法:降低node版本到 node@10, 升级gulp@4操作步骤:1.先查看node 版本号 node -v2.查看当前文件夹下的 gulp 版本号gulp -v3.如果发现node版本号 过高,比如,我之前的node升级到了最新,node@14,回退node版本到 node@11先安装npm版本控制原创 2021-08-20 16:57:02 · 1904 阅读 · 0 评论 -
npm安装报错(npm ERR! code EPERM npm ERR! syscall mkdir npm ERR! path C:\Program Files\nodejs\node_ca...)
使用npm 安装vue的时候突然报错了:npm ERR! code EPERMnpm ERR! syscall mkdirnpm ERR! path C:\Program Files\nodejs\node_cache\_cacachenpm ERR! errno -4048npm ERR! Error: EPERM: operation not permitted, mkdir 'C:\Program Files\nodejs\node_cache\_cacache'npm ERR! [Op原创 2021-07-23 10:47:48 · 70765 阅读 · 71 评论 -
Syntax Error: TypeError: this.getOptions is not a function
vue运行项目过程中报错:检查代码中并无写错的地方????原因: scss-loader安装的版本过高解决方案:1.npm uninstall --save sass-loader // 卸载2.npm i -D sass-loader@8.x // 安装3.npm uninstall --save node-sass // 卸载4.npm i node-sass@4.14.1 // 安装// 如果node-sass安装失败,也可以直接在package.json中写上版本号,删除node_m原创 2021-06-07 10:44:36 · 393 阅读 · 0 评论 -
vue引入echars5.0报错“export ‘default‘ (imported as ‘echarts‘) was not found in ‘echarts‘的解决方法
vue使用最近的echarts5.0版本的图表,会有警告但是又不影响使用,看着不舒服。import * as echarts from 'echarts' // 或 const echarts = require('echarts')这种引用方式就可以消除warning警告了。原创 2021-06-07 10:21:39 · 403 阅读 · 0 评论 -
el-select使用了多选时,选中多个会撑开原始高度,样式错乱,使用tag展示,一行显示全部内容,超过显示长度并以...显示的方法
使用el-select的多选下拉选择时,如果默认的选择会撑开input,显示所选的全部内容;这样子很难看,样式还不整齐。文档中有tag的形式展现,设置collapse-tags属性将它们合并为一段文字:就不会出现上述的情况了。但是当多选的内容多长的时候,后面还是会撑开换行,照样使样式不整齐:看了上面的element元素发现:这时候需要加内容一行显示,内容超出隐藏,溢出时显示省略标记…的写法了!css基本功大显身手的时候到啦!(记不起来或者不会的小伙伴记得百度哈…)word-break原创 2021-06-03 10:42:27 · 20578 阅读 · 14 评论 -
this.$router.go(0);刷新当前页面在苹果手机失效的解决方法
使用vue写H5页面时,用this.router.go(0);方法刷新当前页面在苹果手机失效,安卓机和pc端,开发工具等都是可行的;想到this.router.go(0);方法刷新当前页面在苹果手机失效,安卓机和pc端,开发工具等都是可行的;想到this.router.go(0);方法刷新当前页面在苹果手机失效,安卓机和pc端,开发工具等都是可行的;想到this.router.go(0)和window.location.reload()都是刷新当前页面的方法;但是this.router.go(0);方原创 2021-03-09 16:43:04 · 2033 阅读 · 0 评论 -
vscode目录显示不是一级一级的显示
vscode目录不是一级一级展示的,如下:有些人会觉得别扭,又不知如果调整;在文件–>首选项–>设置里面去设置如上图,取消对应的勾选,文件目录就一级一级的显示了有兴趣的请加我,邀你进web交流群,一起分享、讨论it技术!...原创 2020-08-27 14:37:32 · 1982 阅读 · 1 评论 -
vue根据不同的环境配置接口路径,带不同版本号的接口路径配置,脚手架2及3以上都可以配置
首先创建两个不同环境的文件;注意:VUE_APP_BASE_API需要和下面的都对应生产环境:#.env.development# just a flagENV = "development"#键值对,必须以VUE_APP开头 # base api VUE_APP_BASE_API = "http://XXXXXXX"开发环境:window.location.origin是指定发布环境的地址,不用每次手动去改了#.env.production# just a flagENV原创 2020-07-02 18:10:33 · 2354 阅读 · 0 评论 -
vue利用elementUI组件实现日期时间选择器带快捷选项且自定义时间选择
使用element日期时间选择器带快捷选项自定义时间:需要picker-options和格式化value-format<el-form-item label="关闭时间:" prop="date"> <el-date-picker v-model="date" type="datetimerange" :picker-options="pickerOptions" ra原创 2020-07-02 11:37:09 · 6596 阅读 · 0 评论 -
vue使用elementUI实现el-table行点击事件触发展开事件
方法一:使用row-key="id":expand-row-keys="expands"@row-click="rowClick"以下代码可直接复制粘贴看效果<template> <el-table :data="tableData5" style="width: 100%" row-key="id" :expand-row...原创 2019-12-19 18:03:46 · 14511 阅读 · 6 评论 -
通过href或者参数传值到另一个页面显示相对应的不同内容
首先,在A.html页面通过a标签的href去传值A.html就下面第一个截图这些内容<ul class="items"> <li> <a target="_blank" href="/user/B?items=0"> 内容1 </a> </li> <li> <a target="_blank...原创 2019-11-28 16:01:59 · 2350 阅读 · 0 评论 -
用Promise对象将异步操作以同步操作的流程表达出来
遇到一个需求,是订单详情页面的商品信息下拉选择的商品不能重复选中;那么在订单页面进去就会有当前订单的商品信息了,当用户想要再添加一个商品信息时,发现上面已经有的商品还可以选中;这就是异步处理了这个禁用问题;下面是禁用的方法:发现this.listSkuInfo断点是空的再看获取下拉选择器中商品的值:如果下拉选择器中有商品的就push到listSkuInfo这个数组中。当我打印发现:...原创 2019-10-23 17:18:04 · 823 阅读 · 0 评论 -
vue使用ant design中table表格,点击某行时触发的事件
使用customRow 设置行属性,写对应事件:customRow="rowClick"然后在data里面写rowClick: record => ({ // 事件 on: { click: () => { // 点击改行时要做的事情 // ...... ...原创 2019-09-04 15:11:26 · 20054 阅读 · 7 评论 -
使用vue初用antd 用v-model来双向绑定Form表单
第一次用vue使用ant designUI框架,还没从elementUI中转换过来…于是在不能用Modal模态框,需要在页面传值接收的时候 handleEdit (record) { this.$router.push({ path: '/form/base-form', query: { id: record, title: 'Edit' } }) }fo...原创 2019-09-03 17:31:15 · 17521 阅读 · 9 评论 -
js中的数组 两个数组值相同时,一个数组改变 另一个数组跟着改变的原因。两个相等的数组,修改其中一个数组怎么做到不改变另外一个数组?论深度拷贝的重要性
示例:现在有两个数组:let arrA = [1, 2, 3];let arrB = arrA;console.log(arrA); // [1, 2, 3]console.log(arrB); // [1, 2, 3]当数组arrA改变时,数组arrB也会改变:arrA[0] = 10; console.log(arrA); // [10, 2, 3]console.lo...原创 2019-11-01 17:49:50 · 1844 阅读 · 2 评论 -
当返回数据需要加特殊字符的;当select的选择器回显需要拼接的两个方法
这里有个select选择器,需要返回是添加@在label回显之前<el-select v-model="value" placeholder="请选择"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"&g...原创 2019-12-04 16:52:38 · 580 阅读 · 0 评论 -
js判断数据类型几种方法
JS数据类型的判断主要有四种方法:typeof、instanceof、Object.prototype.toString.call()。基本数据类型的包括:number、boolean、string、symbol、object、undefined、function等7种数据类型7种数据类型有包含:基本类型值和引用类型值 。 基本数据类型指的是简单的数据段,而引用数据类型指那些可能有多个值组成的...原创 2019-12-09 11:14:33 · 378 阅读 · 0 评论 -
vue请求网络接口中图片无法显示报错403解决办法
自己写的小demo,使用mock数据,发现登录图片请求403,获取不到解决方法如下方法一:在模拟数据avatar图像的前面加上’https://images.weserv.nl/?url=’+'你的图片路径地址’再次登录就有图像了如果是请求后台接口无法获取图像的话方法二:getImages( _url ){ if( _url !== undefined ){ ...原创 2019-12-30 14:45:48 · 2774 阅读 · 5 评论 -
vue实现文字内容无缝向上滚动,鼠标移入停止滚动,鼠标移开继续滚动
<div class="home-list"> <div v-for="item in events" :key="item.id" ref="contlist" :class="{'animate-up':animateUp}" @mouseenter="Stop()" @mouseleave="Up()"> <div class="home-content"> <div cla.原创 2020-07-02 10:38:42 · 3970 阅读 · 3 评论