vue
文章平均质量分 53
蜘蛛上网
delphi C# PHP js vue springboot 一路走来一路学
展开
-
记一次前端Vue项目国际化解决方案
3、前端我们重新封装一个全局方法 $lang(param1, param2) 来支持国际化,param1是国际化编码,param2是默认值(如果国际化编码没找到对应的语言单词,则默认用param2,且去掉左右两边的 ‘~’符号);’) , $lang方法逻辑再修改下,如果没有第二个参数并且第一个参数对应的国际化词语也没有,则直接显示第一个参数字符串,而且这样的话,到后面再提取代码中的需要国际化的内容时就会很精确了。1、开发流程,一开始开发过程中,我们不考虑国际化,等代码基本完成后,最后再进行国际化;原创 2024-02-01 16:40:48 · 2841 阅读 · 2 评论 -
Vue 中 cherry-markdown 组件的使用
1、这里将原插件提供的目录做了设计优化,更加美观点;2、实现了截图粘贴自动上传功能;原创 2023-08-10 11:40:53 · 1728 阅读 · 2 评论 -
npm启动vue应用开发服务器过程分析
npm run 命令执行时,会把./node_modules/.bin目录添加到执行环境的PATH变量中。全局的没有安装的包,在node_modules中安装了,通过npm run 可以调用该命令。打开./node_modules/.bin 目录,我们看到了很多执行脚本,包括我们认识的。原创 2022-09-29 17:14:49 · 5052 阅读 · 0 评论 -
vue 中 mockjs 搭建使用说明
vue中mockjs 搭建使用说明前言 前后端分离的开发模式,前端需要向后端请求数据(ajax请求),但实际开发过程中,前后端会约定一份 接口文档,但前后端开发进度并不一致,当后端没有完善接口功能时,前端需要在本地模拟数据返回,此时需要使用到mockjs。 也就是说,在后端接口还未开发时,前端人员却需要调用接口进行测试前端程序,前端人员就可以使用mockjs来模拟后端接口的返回数据。使用mockjs,我们希望实现目的:1、能够模拟出表记录对象数据2、能够实现模拟出增删改查接口操作3、能原创 2022-03-01 10:13:26 · 332 阅读 · 0 评论 -
VUE 单页应用多页标签显示组件及路由组件缓存设计 (升级后)
单页应用多页标签组件及组件缓存设计优化后解决的问题解决相同name组件路由打开多标签页后,关闭一个时会把其他相同name组件缓存都清除的问题;解决相同name组件路由打开多标签页后,标签页内容有相同的时候出现的异常问题(比如订单详情,两个订单款号相同时,标签头显示相同就会出现问题);解决某些情况下缓存组件没能在内存中清除,导致内存占用的问题;增加了标签可以鼠标右击操作菜单功能,可以关闭当前点击的标签左边或者右边的标签页路由配置项约定所有路由都会缓存,并且都会添加标签头,目前不考虑(部门原创 2022-02-16 11:46:24 · 1044 阅读 · 0 评论 -
vue.config.js vue 打包配置
const CompressionWebpackPlugin = require('compression-webpack-plugin')const productionGzipExtensions = ['js', 'css']const Timestamp = new Date().getTime();module.exports = { publicPath: './', productionSourceMap: false, // false : 不生成map文件 .原创 2021-09-27 09:00:17 · 1486 阅读 · 0 评论 -
vue 自定义 Tree 组件
syTree.vue<style lang="scss"> label{font-size: 14px;}.notetitle{cursor: pointer;}.notetitle:hover{background-color: #eaf4fe;}//移上样式.notetitle-selected{background-color: #d5e8fc;}//点击后样式ul.tree-ul li{line-height:28px;}.tree-square{font-siz原创 2021-09-27 08:58:45 · 838 阅读 · 0 评论 -
javaScript Storage的存取方法封装
因为 js 的 Storage 对象没有过期时间机制,所以增加控制有效期的扩展方法,set和getconst myStorage = { // 设置缓存值 setItem: (key, value, expire) => { let obj = { data: value, time: Date.now(), expire: expire }; localSto原创 2021-09-27 08:56:02 · 789 阅读 · 0 评论 -
使用 HBuilderX 和 微信开发者工具 在开发测试过程中的问题
1、HBuilderX 运行测试时,无法调起 微信开发者工具解决: 在微信开发者工具中,设置菜单->安全设置里,将服务端口打开。2、微信开发者工具中,真机调试 按钮是灰色的,处于不可点击状态解决:需要将当前运行的小程序配置好AppID,然后再运行,就可以真机调试了。AppID是在uni-app项目的 manifest.json里配置3、错误码:80058,desc of scope.userLocation is empty 的解决方案 使用uniapp开发微信小程序后运原创 2021-09-27 08:52:45 · 1757 阅读 · 0 评论 -
keepAlive 单页应用多标签 路由缓存的设计
由于使用了多标签显示方式,缓存的设计需求分析1、设计需求 可以配置一部分路由需要缓存,一部分不需要缓存 在已打开的标签页栏中,切换标签页,使用缓存,不要重新渲染组件 关闭已打开的标签页时,同时清除对应标签页组件缓存 通过点击导航菜单或者页面按钮,打开的路由标签不要使用缓存,需要重新渲染或刷新已打开的标签页 2、代码实现2.1、store/index.js 定义全局变量 keepAliveList 和 操作方法增加一个全局变量 keepAliveLi原创 2021-09-26 10:15:09 · 383 阅读 · 0 评论 -
Vue 单页应用 路由多标签显示设计
设计样式如图:设计规格描述: 当某个路由被第一次打开时,在标签栏最后插入新标签,标签内容显示为 页面名称 + 关键参数值 点击某个标签时,显示该标签的路由页面 点击标签上的 × , 如果关闭的不是当前显示的标签页,直接删除这个标签就可以了 如果关闭的是当前显示标签页,移除标签,并且后退到当前标签左边一个标签页 打开同一个路由页面时,但是传的关键参数值不同,要插入新标签页 (标签的唯一性key判断 = 路由元素数据meta..原创 2021-09-26 10:06:27 · 1476 阅读 · 0 评论 -
Vue 单页应用 axios请求时 全局遮罩层设计
系统需求:在前端有请求时,并且请求还没有接收到响应时,需要显示个遮罩层,并显示加载状态,来屏蔽用户的操作;等所有请求都完成后,遮罩层消失,用户可以继续操作。设计方案:在主组件App.vue里,我们加一个遮罩层;在store.state里加一个用来统计当前正在请求的个数 request_count ,这样我们就可全局来更新该变量,当有请求时 request_count + 1,当前有请求返回时request_count - 1 。1、store/index.js...原创 2021-09-26 09:50:59 · 2096 阅读 · 0 评论