- 博客(45)
- 收藏
- 关注
RSS订阅原创 vue3加vite 添加环境变量
1.需要在项目根目录添加一个文件叫 .env.development这是我项目中定义的变量 VITE_APP开头VITE_APP_TITLE=开发环境测试标题VITE_APP_GLOBAL_REGION_ADDRESS=https://dev-XXXXXXXX.cnVITE_APP_TENANT_REGION_ADDRESS=https://XXXXXXXXXX.cnVITE_APP_IMAGE_ADDRESS=https://devXXXXXXXX/根目录进行创建一个 static.env.
2022-03-03 16:46:53
1419
原创 Vue 3使用vite 2.0 动态引入本地图片img
需求：引入到js中批量绑定在dom上，作图标进行展示。这样就可以动态引入了第二种直接引入import tyarticle_iconpe from '@/assets/images/home_icon/brochure_icon.png'第三种可以直接在assets前面加一个src就能识别了new URL(`/src/assets/images/home_icon/name_icon`, import.meta.url).href...
2022-03-03 16:33:53
3370
原创 简历上传vant
<div class="upload-img p-t-10 p-l-20 spe-field bgc-fff m-t-10"> <div class="m-b-16">请上传简历（word,pdf,图片，最大5M）</div> <van-uploader :after-read="afterReadwed" accept=".pdf,image/*,.doc,.docx" upload-i...
2021-09-13 14:14:59
255
原创 下载pdf格式简历 vue
<div v-show="resumeDetail.attResumeType" class="card m-t-10 p-l-r-60"> <div class="job-cell"> <span class="job-cell_label"> <span v-for="w in '简历'" :key="w" class="job-cell_label">{{ w }}</span>...
2021-09-09 16:40:25
220
原创 封装一个表格vue-element
共用组件 TableModule.vue<template><divclass="employment-block"><slotname="header"></slot><el-tableborder:data="tableData":header-cell-style=" {backgroundColor:'#F5F6FA',color:'#222'}"class="b-r-12cus...
2021-09-09 16:10:12
323
原创 h5跳转到小程序的步骤
1.引入微信的链接 <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>2.获取当前的微信的appid及其他的信息appId: ""debug: falsenonceStr: ""signature: "" async useWx(){ try { const data = await getWxConfig({ //后台的接口
2021-06-25 11:22:15
901
1
原创 moment.js 获取时间 本季度、上个季度、本周、上周、 本年、去年、今天、昨天
本季度const start = moment().startOf('quarter').format('YYYY-MM-DD') // 开始const end = moment().endOf('quarter').format('YYYY-MM-DD') // 结束上个季度const start = moment().quarter(moment().quarter() - 1).startOf('quarter').format('YYYY-MM-DD')const end =
2021-05-07 14:27:10
3259
原创 面试总结
1. 平时都用到过哪些设计模式？？？设计模式是一套反复使用、分类的代码设计经验的总结、一般有23中，安照分类可以分为：1）创造型模式抽象工厂的模式工厂方法的模式单例模式构造模式原型模式2）创造型模式代理模式装饰者模式组合模式桥接模式适配器模式外观模式享元模式3）创造型模式策略模式命令模式状态模式责任链模式解释器模式观察者模式备忘录模式模版方法模式访问者的模式中介的模式迭代器模式常用的使用的有以下几种：单列模式单例模式 就是一个类只有一
2021-01-06 20:03:13
108
原创 正则校验
身份证校验：同时校验18位和15位的身份证let _IDRe18 = /^([1-6][1-9]|50)\d{4}(18|19|20)\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/let _IDre15 = /^([1-6][1-9]|50)\d{4}\d{2}((0[1-9])|10|11|12)(([0-2][1-9])|10|20|30|31)\d{3}$/// 校验身份证：if( _IDRe18.test(
2020-09-10 14:37:31
166
原创 vue mock的使用
mock的官方文档需求：实际开发中，前后端分离，前端需要后端的接口去完成页面的渲染，但是并不能等到后端成员写完接口再开始进行测试。大部分情况下，前后端需要同时进行开发。因此便需要mockjs制造随机数据来进行后端接口模拟。安装：mock.jsnpm install mockjs --save-dev在vue的srcx下创建一个mock.js的文件夹将mock.js引入到main.js中require('./mock.js/index')1.在mock.js的index.jsconst
2020-05-21 18:29:41
213
原创 vue axios下载excel文件的两种情况
需求：点击模块进行下载excel文件1.后台这边返回给我的文件流，如下图：现在我点击下载excel按钮 对后台请求数据//这是我的请求接口 //我在axios封装的时候是传递了三个数据export const downloadExcel = function(params) { return post( "/tms//downloadExcel", //url { params: params //请求参数 }, { responseType:
2020-05-20 17:45:14
1266
1
原创 host映射
需求：前段时间微信获取code在本地无法调试，每次需要后台进行部署，则无法正常的调试。然后我用了host映射hosts在各个系统中所在的文件夹：Windows 系统hosts位于 C:\Windows\System32\drivers\etc\hostsAndroid（安卓）系统hosts位于 /etc/hostsMac（苹果电脑）系统hosts位于 /etc/hostsiPhone（iOS）系...
2020-05-07 15:37:04
999
原创 vue 微信网页授权的使用
需求：在公众号中进行网页授权需跟第三方的微信官方文档进行交互引入sdk的文档，我用的1.5版本 微信官方文档基本流程：我是在首页进行的授权的，所以直接在main.js里进行发起授权请求网页授权条件就是 ：scope=snsapi_userinfovar ua = navigator.userAgent.toLowerCase(); if (ua.match(/MicroMes...
2020-05-07 15:20:25
811
原创 将本地项目代码添加到git上
在github上创建一个新仓库复制刚创建的项目git地址git init初始化相当于再项目的更目录生成一个 .git 文件git remote -vgit remote add origin git地址git add .将本地文件添加到文件缓冲区git commit -am “注释”引号里面的注释是你这次提交的什么内容做个注释，方便以后方便看git branch查看...
2020-04-29 18:28:19
2461
原创 react dva中的路由跳转方式写法
1.从父级 继承 history.push( 目标路径)；2，有时候会拿不到histort信息；从dva/router 使用 withRouter 在使用第一种方法；3，从dva/router 使用 Link 标签 ;4，从dva/router 使用 reduxRouter ； 在effact中使用 put(reduxRouter({pathname:目标路径})); 需要传参数 的...
2020-04-29 16:22:17
922
原创 react-dva修改默认端口的方法
工具：vscode需求：有时候可能需要同时开启俩个dva项目，当我们直接npm start新项目的时候会提示：Would you like to run the app on another port instead?但是在一些情况下就算选择了yes，也不会自动切换新的端口。（如下图一直这个样子。。。）解决方法：此时只需手动设置配置文件即可，找到package.json文件，最上面scr...
2020-03-30 14:55:24
514
原创 H5微信分享功能 vue
1.需求：在微信内将指定的页面内容分享给微信好友或者朋友圈2.步骤：引入微信的sdk// public.index中// 我的是最新的微信sdk版本<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> 开发者的权限，需要后台给你配置，不然你没有权限在微信文档中进行开发3,...
2020-03-17 12:05:11
2200
1
原创 全局loading vue
loading 组件<template> <div class="mock"> <div class="main"> <img src="http://img.lanrentuku.com/img/allimg/1212/5-121204193R0-50.gif" alt="" /&g...
2020-03-14 14:48:40
176
原创 vue返回首页后如何清空路由
需求一：从首页点击路由到A页面A页面点击路由到B页面B页面点击路由到C页面C页面点击路由链接到D页面D页面有个返回首页按钮那么问题来了点击返回首页后，再点击手机的返回键 会打开D页面 再按手机返回键 会打开C页面，依次类推，如何才能实现点击返回首页后，清空路由呢mounted () { if (window.history && window.history...
2020-03-13 14:51:47
9640
2
原创 实现一个返回首页的小按钮 ，可以进行拖动 vue
需求：实现一个返回首页的小按钮 ，可以进行拖动。<template> <div class="back-home" @click="goUrl" ref="moveBtn" @mousedown="down" @touchstart="down" @mousemove="move" @touchmove="move"...
2020-03-13 10:04:51
477
原创 vue导航栏/公共组件在部分页面显示,在其它页面不显示
需求：结合拖拽的返回首页按钮，让在首页/登陆页不展示出来，其他页面都展示的需求进行开发1 .router-view结合$route.meta在app.vue<template> <div id="app"> <div v-if="$route.meta.keepAlive"> <router-view v-wechat-tit...
2020-03-13 09:59:31
2586
1
原创 RSA非对称加密传输-——前端js加密，后台解密 vue
1.需求：将支付密码进行加密2.用rsa进行加密后台会生成一对公私钥，私钥存在服务器，把公钥给前端，前端加密后传给后端，这是相对比较安全的做法。3.进行下载rsanpm install jsencrypt 或者 cnpm install jsencrypt --save4.引入到vue中import JSEncrypt from 'jsencrypt/bin/jsencrypt'...
2020-02-18 16:53:53
733
原创 上传照片
需求：1.需要前端将照片上传到七牛服务器上，后台根据文件名来返回图片。要求：上传到七牛服务器上有两个要求：获取七牛的token 值 将获取到的key值（文件名）给后台就可以了1. 获取七牛上传token 后台给接口 getqiNiuToken({ bucket: "archivedata", //参数 insertOnly: 0 //参数 })...
2020-02-16 21:29:41
185
原创 vue 阻止冒泡事件
<div @click="a"> <button @click="b"></button></div>// 点击b 时，a也触发需求：点a 触发a 点b 触发b在button上添加@click.stop="b"，来阻止事件冒泡。...
2020-01-08 14:32:02
197
原创 获取url上的参数 vue
1.需求：获取ios和安卓两端的url参数，解决如下再 created() 里面 let url = window.location.href; this.urlData = data; //// 再 methods里面 parseQueryString(url) { // var str = url.split("?")[1]; console.log...
2019-12-31 11:22:40
303
原创 vue 在h5上修改标题 title
1.我的需求如下：我这个项目需要在公众号中打开H5切换组件 更改组件上面的title1.也是根据网上的各种方法综合来实现的,先安装一个插件npm install vue-wechat-title2.在mian.js 中引入import vueWechatTitle from "vue-wechat-title";Vue.use(vueWechatTitle);3.在app组件中...
2019-12-20 10:23:37
1648
原创 sessionStorage的用法
1.存值sessionStorage.setItem('a','111'); // 将111的值存在了a的变量中2.取值sessionStorage.getItem('a'); // 从a的变量中取值进行赋值3.删除值sessionStorage.removeItem("a") // 将值删除掉了4.全部清空sessionStorage.clear() // sessionSt...
2019-12-17 14:49:23
366
原创 textarea 高度自适应的进行填写内容 vue
固定高度可以设置 rows 属性或者 min-height 样式。1.vue中用法<textarea id="feedback" rows="2" placeholder="请输入您想反馈的问题" v-model="feedback" @input="handleInput"></textarea>handleInput(e) { e.target.style....
2019-12-13 10:41:29
245
原创 iOS设备在浏览器的键盘出现会将H5页面上顶，下不来底部的bug
blur 事件 blurClick() { window.scroll(0, 0); // },
2019-12-11 11:32:55
504
原创 文字弹幕，左右滚动 vue
1.轮播图 <div> <van-swipe :duration="6000" :autoplay="3000" indicator-color="red" immediate="true" :show-indicators="false"...
2019-12-11 11:19:11
911
原创 dist文件打包后，想在本地查看项目效果
第一安装npm install -g live-server 命令在dist文件里面 与index.html文件 平行，右键出现git bash 来执行live-serve命令
2019-12-10 16:49:53
783
1
原创 dist打包之后报警告 vue
如下图：是打包之后，报的警告，想解决这个问题需要在vue-config中添加这行代码在vue-config中设置这行代码，就可以解决上面的问题configureWebpack : { performance: { hints:‘warning‘, //入口起点的最大体积 整数类型（以字节为单位） maxE...
2019-12-10 16:25:10
334
原创 vue 路由拦截
需求:项目在浏览器中会出现登陆以后，还可以返回登录页的问题，这里需要做以下的处理,这里用到了router.beforeEach。在main.js文件中router.beforeEach((to, from, next) => { if (sessionStorage.getItem("token")) { // 登陆以后将token的值存在了sessionStorage中，用ge...
2019-12-09 09:10:42
90
原创 时间戳变时间格式
1.npm install vue-moment –save2.全局引入Vue.use(require(‘vue-moment’));3.使用方法{{item.createTime|moment(“YYYY-MM-DD HH:mm:ss”)}}
2019-12-06 15:14:40
78
原创 做移动端H5在手机上如何测试
1.在本地电脑上开发完了，想测试一下在手机上展示的效果，或者会又啥bug2.第一种：局域网本地将服务起了，然后手机，与电脑连的是一个wiff上面这个network的地址直接在浏览器中打开就可以访问了。3. 第二种：anyproxy插件 步骤如下：// 1.在项目中安装anyproxy 命令：npm install anyproxy -g// 2.window键+r ...
2019-12-03 17:04:13
3696
原创 移动端 判断客户端是IOS手机还是Android手机 vue
1.我的需求是 展示不同的下载按钮，ios展示直接跳转ios-store App中`https://itunes.apple.com/cn/app/id$(121313)?mt=8` // l里面的id 根据你的app来进行更改 直径跳转到了ios的app中下载2.判断客户端的手机是啥手机，用以下的代码 created() { this.appSource(); }, me...
2019-12-02 16:21:26
912
原创 在vue项目中html2canvas实现网页为图片形式下载到本地
我的需求：需求描述：将后台返回的链接 生成二维码 将二维码及以上的html 变成图片 ，保存在本地上。下面我根据二维码生成图片用到了html2canvas渲染成canvas1.项目中引用需安装 html2canvasnpm install --save html2canvas // 在需要使用的页面中先引入html2canvas import html2canvas from 'h...
2019-11-27 18:58:58
1197
原创 vue手机登录页及短信验证
这是我的需求如下：图片说明：这个没有确定登陆的按钮，需要监听input框的值来进行判断。1.我用的是vue移动端的 vant 框架 html 结构如下：<div class="titleInput"> <input v-model="phoneNum" class="phone-num" type="text...
2019-11-25 12:17:20
2845
5
原创 vue中生成二维码或者中间带logo图
1.中间无logo图的二维码执行一个命令 npm install qrcodejs22.引入需要生成二维码的组件中 **import QRCode from 'qrcodejs2'** 并注册 **components: { QRCode }** 3.将结构放在template中 例如 ：<div id="qrcode" class="codeQr" ...
2019-11-20 14:48:46
1599
原创 vue 父传子值 子改变父的值
1. 父传子的情况第一种情况父组件的写法···引入子组件到父组件里面然后注册子组件到父组件然后将组件放入到父组件的结构html中然后将父组件在data中定义的变量放在子组件中 如上图 ：flagOne=“flagOne” 冒号前面 的是在子组件中定义的变量 等号后面的变量是父组件data中的变量名··· 或者只传一个布尔值就直接在父组件写一个 &l...
2019-11-19 18:20:07
2345
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人