- 博客(58)
- 收藏
- 关注
RSS订阅原创 登录信息失效后多次请求提示合并成一次
类似这种多个提示的,看起来不美观,希望改成可以把在短时间内出现相同的错误信息,只提示一次,其他的就不提示了。在通常的业务场景中经常会出现进入页面之后一次性发送好多个请求,如果登录信息失效,那就会出现很多提示。
2024-04-08 22:54:25
470
原创 vue后台管理前端实现权限控制
实现思路： 用户登录之后把用户信息存储到vuex中。 // store.user.js import { login, logout, getInfo } from '@/api/user' import { getToken, setToken, removeToken } from '@/utils/auth' import { resetRouter } from '@/router' const getDefaultState = () => { return { token
2022-03-27 13:49:35
1245
1
原创 js深拷贝
使用JSON.parse(JSON.stringify())方式来进行深拷贝 let arr = [1,2,3,4,[5,6,7]] let obj = { name:'张三', age:20, children:{ name:'李四' } } let copyArr = JSON.parse(JSON.stringify(arr)) let copyObj = JSON.parse(JSON.stringify(obj)) console.log(.
2022-01-20 16:33:26
840
原创 获取指定范围内的随机数
function sum(m,n){ var num = Math.floor(Math.random()*(m-n)+n) return num }
2022-01-14 16:45:58
636
原创 二次封装mescroll
<template> <mescroll-vue ref="mescroll" :down="mescrollDown" :up="mescrollUp" @init="mescrollInit" > <div id="mecroll_dataList"> <slot></slot> </div> </mescroll-vue> </templat
2021-09-07 17:19:55
551
原创 node+express实现图片上传接口
需要用到的依赖 1.moment //时间序列化 2.mkdirp //文件夹管理 3.multer 上传 /* tools.js */ // 先引入需要用到的依赖 const multer = require('multer') const mkdirp = require('mkdirp') const moment = require('moment') // 获取当前的日期 const nowDate = moment().format('YYYY-MM-DD') // 封装保存
2021-06-21 18:15:33
1847
4
原创 安装cnpm和安装yarn和卸载node
安装cnpm npm install -g cnpm -registry=https://registry.npm.taobao.org 安装yarn npm install -g yarn 卸载node 可以找到node的安装的msi文件，如果找不到的话，就从官网从新下一个，点击安装，会出现change,remove之类的按钮，点击remove然后跟着操作删了 ...
2021-01-30 19:17:30
1238
原创 jq实用插件
Viewer.js 支持移动设备触摸事件 支持响应式 支持放大/缩小 支持旋转（类似微博的图片旋转） 支持水平/垂直翻转 支持图片移动 支持键盘 支持全屏幻灯片模式（可做屏保） 支持缩略图 支持标题显示 支持多种自定义事件 ...
2020-12-10 21:23:52
252
原创 git常用命令
仓库 # 在当前目录新建一个Git代码库 $ git init # 新建一个目录，将其初始化为Git代码库 $ git init [project-name] # 下载一个项目和它的整个代码历史 $ git clone [url] 配置 # 显示当前的Git配置 $ git config --list # 编辑Git配置文件 $ git config -e [--global] # 设置提交代码时的用户信息 $ git config [--global] user.name "[name]" $
2020-11-24 15:59:29
179
原创 vue-cli使用gz
先下载依赖 $ npm install compression-webpack-plugin --save-dev $ npm install @gfx/zopfli --save-dev vue.config.js中进行配置 const CompressionPlugin = require("compression-webpack-plugin"); const zopfli = require('@gfx/zopfli'); module.exports = { configureWebpac
2020-10-27 10:28:21
365
原创 vue-cli去除console.log
安装依赖 npm install babel-plugin-transform-remove-console --save-dev 查看Vue项目根目录是否有 babel.config.js 文件，没有就新建一个 const plugins = [] if (process.env.NODE_ENV === 'production') { plugins.push('transform-remove-console'); } module.exports = { presets: [ '@
2020-10-22 15:14:02
588
原创 react笔记
创建react项目 npx create-react-app my-app 使用sass预编译器 注:由于create-react-app里面内置了sass,所以只需要下载 node-sass 模块便可使用,如果需要使用其他的预编译器,则需执行 yarn eject 获取到webpack.config.js文件进行自己配置 npm install node-sass -D 下载完node-sass依赖之后即可直接使用sass import React from 'react'; import './A
2020-10-14 16:36:58
143
原创 使用element+vuedraggable实现图片上传拖拽排序
// 上传组件 <template> <div class="allUpload"> <div class="clearfix"> <div class="wrap"> <draggable v-model="value" forceFallback="true"
2020-10-12 18:24:36
2473
2
原创 vue使用云片滑块验证码
文档地址https://www.yunpian.com/official/document/sms/zh_CN/captcha_captcha_service_h5 效果图 封装成组件 <template> <div class="Yp"> <div id="wrap" class="middleCenter" v-show="show"></div> </div> </template> <s
2020-09-21 15:08:03
1068
原创 js获取两个时间的天数差
getDayNum(startTime,endTime){ const stTime=Date.parse(new Date(startTime)) const etTime=Date.parse(new Date(endTime)) const usedTime = etTime - stTime; const days=Math.floor(usedTime/(24*3600*1000)); return days } getDay
2020-09-18 11:43:19
1083
原创 使用monentJs笔记
moment(new Date()).format('MM月DD日'); // 09月01日 moment(new Date()).format('MMM'); // 9月 moment(new Date()).format('MMMM'); // 九月 moment(new Date()).format('dd'); // 六 moment(new Date()).format('ddd'); // 周六 moment(new Date()).format('dddd'); // 星期六 moment(n
2020-09-16 17:54:52
261
1
原创 vue在自定义组件中使用v-model
父组件代码 // 父组件中引入子组件并使用 <template> <children v-model='active'/> </template> <script> import children from '@/components/children' export default { data() { active:'' } } </script> 子组件代码 <template> <div>
2020-09-04 10:45:48
666
原创 vue-cli使用cdn优化
首先创建vue.config.js 在vue.config.js中配置 先把你要加载的cdn链接写好 // vue.config.js const cdn = { css: [ "//cdn.jsdelivr.net/npm/vant@2.8.6/lib/index.css", "//unpkg.com/nprogress@0.2.0/nprogress.css" ], js: [ "//unpkg.com/vue@2.6.11/dist/vue.min.js",
2020-09-03 16:56:56
1071
2
原创 vue点击弹框外部关闭弹框
<template> <div class="passwordError"> <van-overlay :show="show" @click="clickOverlay" > <div class="content" ref="contentWrapper"> 内部区域 </div&
2020-09-03 15:21:30
2721
1
原创 vue-cli使用百度地图
首先,先去百度地图开放平台申请一个ak秘钥 在自己的vue项目里面的index.html页面里 先引用百度地图的cdn <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=你申请的ak秘钥&s=1" ></script> 然后再vue.config.js中进行配置百度地图,不然会出现 BMap is not defined的错误 configureWebpack:{
2020-08-28 11:12:42
661
1
原创 vue+vant注册全局loading组件
// loadgin.vue <template> <van-popup :close-on-click-overlay="false" v-model="show" style="background-color:transparent" > <div class="loadingWrap"> <van-loading v-if="show" type="spinner" /
2020-08-21 17:45:45
4571
原创 js下载本地文件
function download(url, filename) { return fetch(url).then(res => res.blob().then(blob => { let a = document.createElement('a'); let url = window.URL.createObjectURL(blob); a.href = url; a.downlo
2020-08-03 10:19:13
2755
1
原创 vue使用bus进行父子组件传值,以及解决bus多次触发的问题
新建一个bus.js文件 // bus.js import Vue from 'vue' export default new Vue; 子组件 <template> <button @click="handleOpenModal"> </button> </template> <script> import Bus from './bus.js' export default { name: "children", methods:
2020-06-10 17:43:35
1691
原创 vue踩坑(一) vue-cli项目的创建及vuex的详细使用
全局使用scss 点击子路由父路由还有对应的选中状态 解决根路径一直为选中状态的问题 vue使用scss 在vue单文件中使用 /deep/ 来修改ui插件的样式,比如element 使用 vuex-persistedstate实现vuex持久化 路由命名视图的使用 vue-cli的请求代理 vue-i18n的使用 重定向实现404页面功能 实现页面跳转出现进度条 vuex的使用 实现路由的嵌套跳转 ...
2020-05-27 23:53:51
1430
原创 组装树节点
function toTree(data){ // 删除 所有 children,以防止多次调用 data.forEach(function (item) { delete item.children; }); // 将数据存储为 以 id 为 KEY 的 map 索引数据列 var ma...
2020-04-26 16:55:33
354
原创 js字符数组转化为数字数组
// 例如一个字符串数组 const arr = ['1','2','3','4'] //转换成 const numberArr = [1,2,3,4] // 只需要使用 arr.map(Number)
2020-04-23 15:56:12
997
原创 vue跳转路由时显示进度条
通过nprogress组件来实现进度条功能 yarn add nprogress 在router.js里面使用 import Vue from 'vue' import VueRouter from 'vue-router' import NProgress from 'nprogress' import Login from '../views/Login.vue' import 'npro...
2020-03-31 14:03:40
609
原创 通过coding pages如何搭建静态网站？
https://help.coding.net/docs/devops/cd/static-website.html
2020-03-30 16:40:11
3130
原创 react阻止事件冒泡
class OuterClickExample extends React.Component { constructor(props) { super(props); this.state = { isOpen: false }; this.toggleContainer = React.createRef(); this.o...
2020-03-17 15:44:59
514
原创 使用tinymce-react富文本编辑器
在项目中，经常需要使用到富文本编辑器，市场上有很多各式各样版本的，但是感觉功能都不怎么强大，最近发现一款富文本编辑器，使用简单方便，功能强大。 TinyMCE：功能强大、所见即所得的富文本编辑器 中文文档地址：http://tinymce.ax-z.cn/general/basic-setup.php 英文文档地址：https://www.tiny.cloud/docs/ 使用富文本编辑器tiny...
2020-02-05 11:14:19
7726
5
原创 react使用laydate
最近项目中使用的是react+antd，因为设置秒杀活动需要用到时间场次，需要控制最大时间和最小时间，个人觉得antd的时间控件不太好用，所以就使用了layui里面的laydate控件 首先下载依赖 npm install layui-laydate 使用laydate ...
2020-02-05 10:42:08
630
1
原创 moment.js时间戳与时间的转换
// 获取当前时间 const currentTime = moment() // 获取当前时间的时间戳 (秒) 大写的X const miao = moment().format("X") // 获取当前时间的时间戳 (毫秒) 小写的x ...
2019-12-27 14:16:50
10500
原创 排序
const array = [ {specName:'北京'}, {specName:'上海'}, {specName:'深圳'}, {specName:'武汉'}, {specName:'阿里'}, ]; const resultArray = array.sort( function compareFunction(param1, param2)...
2019-12-18 10:33:40
318
转载 常用正则表达式
一、校验数字的表达式 1 数字：^[0-9]*$ 2 n位的数字：^\d{n}$ 3 至少n位的数字：^\d{n,}$ 4 m-n位的数字：^\d{m,n}$ 5 零和非零开头的数字：^(0|[1-9][0-9]*)$ 6 非零开头的最多带两位小数的数字：^([1-9][0-9]*)+(.[0-9]{1,2})?$ 7 带1-2位小数的正数或负数：^(\-)?\d+(\.\d{1,2})?$...
2019-11-11 15:21:15
160
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人