- 博客(22)
- 收藏
- 关注

原创 Vue后台管理系统权限动态路由,根据不同用户渲染不同的路由
Vue后台管理系统权限动态路由该项目搭建的框架使用的是vue+ant-pro,这里说一下大概思路和流程**1.首先路由的地方应该分为两块,一块是不需要权限就可以直接登录看到的(看具体需求,也可以一快),一块是需要动态加载的路由信息集合**动态路由里面的meta属性里面需要一个字段用来放权限(和登录是后台返回的权限key一样)然后的思路是登录的时候后台会根据这个账号返回他对应的权限信息,返回权限路由/或者权限key然后拿到这一组权限id和我们的动态路由去做筛选,赛选出对应的路由,然后把这路由添加
2020-09-18 18:04:54
7402
1

原创 项目使用高德地图在浏览器(谷歌内核)中会变得超级卡的情况以及异步加载高德地图
1.一开始项目是使用vue做的一个可视化项目,里面大量的用了高德地图,用了高德的卫星地图和自定义地图。2.bug出现:当项目运行在谷歌浏览器上是,或者有谷歌内核的浏览器(edge)在切换页面时会卡死浏览器。/(ㄒoㄒ)//(ㄒoㄒ)/,然后直接懵逼了,先把项目中的报错解决掉。2.1,一开始调用高德是直接在index.html中放的script.为了优化就要是地图加载为异步。叮叮叮!!!!↓看代码①单独建一个js(如Amap.js):assets/Amap/Amap.jsexport defau
2020-07-22 09:53:21
6250
9
原创 Nuxt,node项目打包部署到线上流程及其操作
Nuxt或node项目打包部署到线上流程及其操作!1.先在本地执行npm run build 命令npm run build2.打包后将 .nuxt , static, package.json ,nuxt.config.js 4个包上传到网站的目录下。3.在服务器上安装依赖(需要用到 pm2管理,pm2内置了node.js,只需要安装pm2就行,这里用宝塔举例,在商店安装pm2)注意:安装pm2 默认node版本是最新的,可以检查是否和开发环境下的版本一致,如果不一致在设置里面进行切换版本
2021-12-06 10:57:17
1793
1
原创 app,h5落地页实现跳转快应用,可用于抖音,快手,头条投放链接
1.首先要写一个静态的html挂在服务器上生成一个h5的链接html代码:<!-- saved from url=(0028)http://quickjl07.qxjeff.com/ --><html lang="en" data-dpr="1" style="font-size: 41.1px;"><head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"&g
2021-10-14 17:54:06
7554
原创 vue写树型结构组织图,动态组织类型图,拓展图
父组件:<template><div> <TreeChart style="min-width:1000px;overflow-x:auto" :json="treeData" :class="{landscape: isVertical}" :isDetail="isDetail" @add="addStock" @delete="deleteStock" /> <el-dialog title
2021-10-14 17:40:54
594
1
原创 uni-app小说阅读页,vue小说阅读页,静态demo
uni-app小说阅读页,vue小说阅读页,静态demo先看示列图:**整个页面代码(uni-app的页面,放到vue页面需要将代码内的 uni设置的缓存 进行替换成vue的) (文件访问图片请自己结合用你自己的)<template> <view class="page" :style="{'background':global_bg}"> <view class="read_main_p"> <p>第1章</p> <
2021-07-09 17:26:14
1838
原创 将 URL 查询参数转化为js对象的方式{key:value}
将 URL 查询参数转化为js对象的方式{key:value}最好的写法function parseURLToObj() { let resObj = {} const pList = new URLSearchParams(location.search) pList.forEach((val, key) => { resObj[key] = val }) return resObj //{key:value,key2:value2} }...
2021-07-09 17:13:48
501
原创 GIT本地新建分支并提交到远程仓库,合并远程master分支 从0到1过程
GIT本地新建分支并提交到远程仓库,合并远程master分支 从0到1过程1.建立本地仓库(命令行也可以)查看当前项目根目录中有没有 .git文件(隐藏文件),如果没有输入命令git init建 立本地仓库(或者新建一个文件目录,在这个目录下打开命令行:)git init拉取远程分支git clone 你的远程地址(https/SSH)3.拉取好了代码可以检查一下,检查有哪些分支git branch 4.添加代码到本地(可以将原目录的代码整个复制到现在这个目录下)5.将代码
2021-07-08 10:57:19
1540
原创 项目使用微信公众平台图片显示此图片来自微信公众平台 解决方法
项目使用微信公众平台图片显示此图片来自微信公众平台 解决方法vue页面:html: <div style="width:61px;height:61px" v-if="items.thumb_media_url.includes('mmbiz_jpg')" v-html="ImgFun(微信公众图片地址)""></div> js: ImgFun(url){ var randomId = 'img' + url; window[`img${url}`]
2021-06-30 14:26:25
727
原创 vue下载pdf ,不预览直接下载
vue下载pdf ,不预览直接下载 var ajax=new XMLHttpRequest(); ajax.open( "GET", '图片地址', true); ajax.setRequestHeader("Cache-Control","no-cache") ajax.setRequestHeader('Access-Control-Allow-Origin', '*'); ajax.responseType = 'blob'; a
2021-06-21 09:56:09
2096
2
原创 Vue多个echart的datazoom以及悬浮框联动的示例代码
多个echart的datazoom以及悬浮框联动的示例代码图片列子:html代码:<div id="main" style="width: 100%;height:35vh;min-height:380px"></div> <div id="main2" style="width: 100%;height:35vh;min-height:380px;margin-top:10px"></div> iniChart(EchartValue) {//接
2021-03-31 15:29:43
444
原创 小程序模仿蚂蚁森林浇水demo,树木浇水
小程序模仿蚂蚁森林浇水demo各位伸手党可以直接拿页面大概长这个样子;其中的进度条用到了vant-weapp这个组件vant-weapp官网wxml代码:```html<view class="return" bindtap="before"> <van-icon name="arrow-left" size="22px" color="#fff" /> </view><view class="box"> <view cla
2020-08-26 14:29:52
6538
11
原创 微信小程序连续签到获得积分
微信小程序连续签到获得积分demo话不多说!!(伸手党的福利)直接上代码,先看一下实际图叮叮叮!!!wxml代码<view><view class='signIn'> <view class='sign-com'> <view class='thead'> <view class='tt'>已连续签到</view> <view class='mm'><label class='n'>
2020-08-26 14:04:59
4520
12
原创 微信小程序中地图定位以及查看路线
微信小程序中关于地图组件的使用(下面是我项目中的一个demo)使用了第三方百度地图,和微信的map组件app.json中引入如下:“permission”: {“scope.userLocation”: {“desc”: “你的位置信息将用于获取周边服务”}他使用地图前询问是否使用定位服务2.搞定腾讯地图开发API ,取得 key值申请开发者密钥(key):申请密钥 ht...
2020-01-19 12:04:16
4479
原创 对MVVM模式的理解和原理
谈谈对MVVM模式的理解和原理1.首先:MVVM分为view ,model ,viewmodelview: 视图模型 。其实就是一个增强版的html ,可以支持变量,一些程序的要素。model:数据模型。其实就是一个保存所有页面所需的变量的对象——data={…}viewmodel : 就是将视图模型和数据模型给绑定起来,以后只要数据模型中的数据改变了,页面中也会跟着自动改变。MVVM的...
2019-12-09 13:25:32
1181
原创 关于v-for中key的理解 diff算法的不好
v-for循环key的作用(用v-for来解释diff的算法原理 及 diff算法与虚拟dom的关系解释)diff算法:从上往下逐层进行比较,给每个节点生成标识符用在同级进行对比,:如果标识符相同,则继续比较此节点的下一级,如果子节点都相同则复用;如果子级有不同,则对此子节点进行判断,节点中如果出现了新的标识符,则新增;如果旧节点的标识符在新中没有出现,则删除;如果标识符相同,内容不同,则进...
2019-12-04 11:01:26
242
原创 vue常见的一些问题
面试时面试官想要听到什么答案(关于一些Vue的问题)1.vue生命周期(钩子函数)问题请说一下vue的生命周期函数(钩子函数)。问题描述首先关于生命周期函数,一般我的第一个问题就是这个,我认为是每个使用vue的都要清楚的,如果这个问题答的问题很大其实我都不太想继续往下进行了。即使英语不标准(我就是不标准的人,并不是说这是个问题)也要去把关键点说清楚,哪个地方有ed哪个地方没有ed其实是...
2019-12-02 23:49:12
218
原创 判断一个对象是否是数组类型的几种方法
判断一个对象是否是数组类型的几种方法-----判断一个类型是不是数组一共有8种方法,如下:var obj1={},obj2=[1,2,3],obj3=new Date();1.通过此对象的爹判断是不是数组的原型对象console.log(//通过此对象的爹判断是不是数组的原型对象obj1.proto==Array.prototype,obj2.proto==Array.prototyp...
2019-12-02 23:34:51
646
原创 Vuex的理解
1.vuex是什么?2.vuex的核心概念;vuex的属性;vuex的数据传递流程;3.为什么要用vuex?对于问题一,我们按官网的描述即可。vuex是一个专为vue.js应用程序开发的状态管理模式(它采用集中式存贮管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化)。对于问题二,vuex五大核心属性:state,getter,mutation,action,m...
2019-11-29 20:08:37
248
4
原创 vue的生命周期(4个阶段,8个钩子函数)
vue的生命周期(4个阶段,8个钩子函数)(1)创建阶段(create):创建组件对象,创建data对象,但是这个阶段还没有创建虚拟dom树。-beforeCreate(){}:组件创建之前自动调用 —此时的$el:undefined ,data:undefined-Create(){}:组件创建完成自动调用–此时可以发送ajax请求,并且可以操作模型数据(2)挂载阶段 (Mount):创...
2019-11-28 18:14:37
5262
1
原创 Es6中一句话数组去重
ES6中新增的快捷对数组去重,类数组去重方法,只需要一句话…// ES6里新添加了两个很好用的东西,set和Array.from// set是一种新的数据结构,它可以接收一个数组或者是类数组对象,自动去重其中的重复项目。 ;当传入一个对象类型时//...
2019-11-10 12:17:10
324
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人