- 博客(170)
- 资源 (12)
- 收藏
- 关注
RSS订阅原创 npm ERR! request to https://registry.npm.taobao.org/fastclick failed, reason: certificate has expire
npm报错：request to https://registry.npm.taobao.org failed, reason certificate has expired
2024-02-25 14:07:27
236
原创 This method should not be called on the main thread as it may lead to UI unresponsiveness报错
ios加载H5显示This method should not be called on the main thread as it may lead to UI unresponsiveness报错
2024-01-12 17:35:53
1311
原创 vant List组件实现上拉加载中 首次进行load事件执行两次的问题
list组件上拉加载第一次加载去执行load事件时，该事件执行两次的问题解决
2023-07-06 15:22:21
2002
原创 关于IE11的样式兼容问题记录
1、布局如下<div class="map-label" :class="{active:isActive}" :style="{marginTop:`${marTopVal}px`}"> <transition name="slide-fade"> <div class="transition-out" v-if="show"> <div class="circle-out" :style="{left:circleLeft,top:circleTo
2023-06-28 15:07:09
811
原创 修改elementUI carousel组件源码实现轮播图卡片化宽度自适应及样式调整
项目中要实现下图效果三说明：效果二和效果三是说明不同宽度达到的组件的效果纯css实现宽度自定义并居中通过elementUI API中发现没有暴露出轮播图卡片化的自定义的宽度，通过查看样式得知是固定的50%的宽度，那么要实现修改宽度可以进行样式覆盖，代码如下：.el-carousel__container { .el-carousel__item--card { width: 850px !important; background: #fff; } .el-carousel__ite
2023-05-29 14:12:37
2328
原创 axios get请求 (failed)net::ERR_CERT_AUTHORITY_INVALID
问题描述：vue项目，使用axios.get请求一个接口，出现如下图所示错误点开详情：但是在地址栏内输入完整的链接进行请求，可以成功返回数据。定位问题：1、首先根据CORS error这个错误定位接口是跨域；2、用跨域浏览器重新加载页面请求接口后返回：axios (failed)net::ERR_CERT_AUTHORITY_INVALID这个错误，定位：因为https请求，谷歌浏览器认为是不安全的链接，可重新在跨域浏览器中输入完整的接口地址，跳出需要确认跳往这个不安全链接后，就可以正常进行
2023-02-28 10:21:07
1962
原创 vue computed内计算属性方法传参及使用
项目中有需求对某些字段进行处理，vue中computed内计算属性无法直接传参进行使用，想要对字段进行动态过滤。html：<div class="order-card" v-for="item in xcDataList" :key="item.orderId"> <div class="info-date"> <div class="date-left">05月13日 周五</div> <div class="date-right">
2023-02-06 17:15:46
859
原创 vue升级报错：[@vue/compiler-sfc] the ＞＞＞ and /deep/ combinators have been deprecated. Use :deep() instead
vue升级报错：[@vue/compiler-sfc] the ＞＞＞ and /deep/ combinators have been deprecated. Use :deep() instead
2022-12-19 09:50:28
1686
原创 vue el-select搜索功能--区分输入内容后得到的是否是下拉框选择数据
区分elementui使用select组件，进行输入后得到的值是输入的值还是通过下拉框选取的值
2022-11-22 18:02:44
2090
原创 vue npm install报错：post install error, please remove node_modules before retry!
报错：× Install fail! RunScriptError: post install error, please remove node_modules before retry!
2022-10-24 17:31:42
10843
3
原创 vue 运行项目浏览器页面显示“该网页无法正常运作”
项目运行成功并自动弹出但是页面上显示：确定问题：检查build/webpack.dev.conf.js文件中是否存在下面代码：disableHostCheck: true,https: true,如果有的话，确定一下是否用的https进行的访问，如果用https进行访问进行信任后，出现以下页面：则需要把鼠标在空白处点击，输入：thisisunsafe相当于告诉谷歌这个是不安全的即可正常打开页面进行访问。......
2022-06-18 11:28:46
3196
1
原创 Git项目的整体迁移
工作需要把一个老项目，完整的迁移到另一个新的git地址上，包括代码及提交记录等，具体操作如下：1、克隆老项目的裸版本库 git clone --bare 旧的git地址此时会在当前的文件夹下产生一个老项目名称.git的文件夹，这个文件夹内就是克隆的老项目的提交记录，只是一个记录，跟本地的代码没有任何关系。2、推送裸版本库记录到新项目cd 老项目名称.git //进入裸版本库文件夹内git push --mirror 新的git地址 //推送记录到新的git项目上结束，完成项目...
2022-05-20 14:58:19
1219
原创 引入vuex报错：“export ‘reactive‘ was not found in ‘vue‘
用vue-cli进行新建项目时没有同步安装vuex，是后续另外用命令加上的，引入后报如下错误提示在vue中未找到这些，比较原来的项目（也是使用的vue2，里面的vuex是3.X的版本，猜测是否是因为版本的问题，尝试后重新安装3.X版本的vuex进行测试，可以运行），发现是版本问题；先删除已经安装的vuex，运行命令：npm uninstall vuex安装指定版本的vuex：npm install [email protected]可以选择安装3.4.0版本的...
2022-04-01 16:45:16
2300
原创 vue解决报错问题：Module build failed: TypeError: this.getOptions is not a function
vue项目执行报错
2022-03-09 11:15:20
1953
原创 通过background-position位移效果实现类似阿里云tab切换动画
直接上代码：<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title></title><style>* { padding: 0px; margin: 0px;}body,html { width: 100%; height: 100%; margin: 0px; padding: 0px;}body { posit
2022-02-14 14:58:11
586
原创 使用vue-awesome-swiper实现轮播图异形卡片化两侧切换显示一半的遮挡效果
vue 可以直接使用插件效果如图：主要设置如下：<swiper class="service-advantage" ref="carouselSwiper" :options="swiperOptions"> <swiper-slide v-for="(item,index) in serviceAdvantageData" :key="`item${index}`"> <div class="card-area"> 第{{index}}张swiper
2022-01-14 11:01:42
4172
原创 elementUI中NavMenu点击二级导航el-submenu无效
项目中需要用到elementUI的NavMenu 导航菜单，需求是除了要进行下拉选中的操作外需要点击二级菜单时要触发绑定的点击事件，但是直接加@click是没有效果的，这时候可以直接用修饰符实现：@click.native使用js的原生点击事件即可...
2021-12-02 09:41:18
2874
原创 js 实现控制input框内只能输入大于0且最多两位小数的数字
控制input框内只能输入大于0、最多两位小数的值<el-input @input="ruleFormlogin.name=clearNoNumTwo(ruleFormlogin.name)" placeholder="@input控制" v-model="ruleFormlogin.name"></el-input>methods：// 处理输入框小数点两位问题clearNoNumTwo(obj) { obj = obj.replace(/[^\d.]/g, '');
2021-11-15 09:53:00
2838
原创 解决elementUI el-form resetFields()方法重置表单无效
问题：表单操作中resetFields()方法在编辑后再次新增失效。在开发过程中新增和编辑功能往往使用一个el-form，在新增完成时，执行 resetFields()方法（即：this.$refs[formName].resetFields();），这样再次打开页面时，不会保留原来的数据，但是先给form赋值执行编辑操作，完成时执行resetFields()方法，再次打开进行新增时，会发现数据依然存在，感觉像是resetFields()方法没有起作用。原因：el-form提供的resetField
2021-10-24 23:55:54
6388
1
原创 echarts 折线图上标记独立坐标点
实现下图所示功能:在多条折线图中，给定一个独立的点坐标，在图上进行显示（图一），点击该坐标点显示该坐标的位置信息（图二）具体实现代码：html：<div id="main" style="width: 600px;height:400px;"></div>jsvar myChart = echarts.init(document.getElementById('main')); let option = { tooltip: { trigger:
2021-10-11 14:19:21
7382
1
原创 mint-ui 页面中多个mt-picker动态获取值在初始化自动执行change事件导致的问题及解决方法
场景：在项目过程中遇到一个页面有多个弹出框需要用到mt-picker，且mt-picker的选项都是动态从接口获取到的。问题:具体如下图所示：在页面初始化时需要调用两个接口分别获取同意选项一和不同意选项的可选数据，给mt-picker绑定@change事件，在页面一进来选择快的话是会出现下图所示：选中项和展示出的不是同一值的情况。原因：在页面初始化的时候@change事件会自动执行，如果在@change内赋值的话，会导致其实没有进行选择时，已经有默认值存在，就可能会出现上图所示情况。解决方案：不
2021-09-03 14:54:06
1268
原创 js 正则 判断是否有中文字符或汉字
方法一：仅判断是否含有汉字function isChina(s) { var reg = new RegExp("[\\u4E00-\\u9FFF]+", "g"); if (reg.test(s)) { alert("包含汉字！"); } else { alert("没有包含汉字！"); }}方法二：判断是否含有中文字符（包括汉字及中文的标点符号）function isHaveChina(str) { if (escape(str).indexOf("%u") < 0)
2021-08-16 16:45:58
21305
1
原创 elementUI el-form动态控制表单验证
要实现如下操作：根据选择的验证方式的值动态控制表单中的校验方式，即默认对手机号进行校验，选择验证方式为手机号，则对手机号进行必填校验且验证手机号的格式是否正确；选择验证方式为邮箱，则对邮箱进行必填校验且邮箱格式是否正确重点：动态控制rules关键代码：:rules="this.isCheckPhone?rules.mobile : [{required: false}]"完整代码代码如下html：<el-form :model="ruleForm" :rules="rules" r
2021-07-28 17:17:55
2560
原创 vue 路由多种传参方式的区别
页面间跳转的传参方式主要分为params和query两种：params：第一种：在路由管理的页面，通过在path里面事先命名要传的参数：export default new Router({ routes: [ path: "/HelloWorld/:id", name: "HelloWorld", component: HelloWorld }, { path:
2021-06-08 15:27:53
1543
原创 css样式实现：带边框的平行四边形
效果：html:<ul class="tab-right"> <li @click="tabAll('factory',index)" class="tab-li" v-for="(item,index) in factoryList" :key="index"> <div :class="{checked:factoryIndex==index}" class="tab-in">{{item.name}}</div> &
2021-05-31 08:51:13
1177
原创 Chrome下ModHeader插件的安装和使用
项目中遇到问题：线上环境在4G网络下加载特别慢，为了查看此问题，在电脑上进行模拟需要请求线上的地址，但是请求线上的地址没有办法直接运行，需要添加请求头，此时用到了Chrome的ModHeader这个插件，可以自定义请求头。上面可忽略，直接进入正题：1、网上搜索此插件，下载：一般网上下载下来的是 .crx格式的，把此格式直接修改格式的后缀为.zip，然后进行解压，得到一个文件夹。2、进行安装：打开谷歌：更多工具-扩展程序，或者直接在谷歌的地址栏中输入【chrome://extensions/】，开
2021-04-07 18:51:17
21058
原创 前端实现base64格式文件的下载
利用Blob对象进行文件的下载例子（此例子是在vue中执行的，其他环境需注意方法的调用）：base64格式文件let docbase64 = 'data:application/octet-stream;base64,0M8R4KGxGuEgCAIAAAAAAMAAAAAAAABGPgADAP7/CQAGAAAAAAAAAAAAAAABAAAAJQAAAAAAAAAAEAAAJAAAAAEAAAD+////AAAAACcAAAD/////////////////////////////////////
2021-03-16 11:15:10
5007
vue实现表头固定、表体可下拉刷新上拉加载
2019-04-26
vue项目分环境打包配置不同命令
2018-06-26
vue项目（基本请求本地数据的底层网络请求和页面间跳转淡入淡出动画效果、header组件的使用、可用scss例子）
2018-06-21
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人