![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
文章平均质量分 69
zhuangvi
代码搬运工
展开
-
Vue 之 工作中常用的公共方法封装整理(不定时更新【2023-07-03已更】)
验证只能为中文数字字母将当前时间转为 yyyy-MM-dd 或 yyyy-MM-dd HH:mm:ss时间戳转化为yyyy-MM-dd 或 yyyy-MM-dd HH:mm:ss将中国标准时间或者yyyy-MM-dd | yyyy-MM-dd HH:mm:ss转成时间戳保留N位小数将数字按千分位显示(可选 return¥、$ 开头的)将中横线连接的字符串转成驼峰格式后端返回文件流下载(导出)文件后端返回base64 下载(导出)文件后端返回文件地址,前端下载文件到本地下载本地资源文件..原创 2021-10-31 14:28:46 · 2547 阅读 · 0 评论 -
Vue 之 后台管理系统的权限路由的管理
一个完整的后台管理系统,往往有很多种角色,如超级管理员、业务模块的管理员、财务模块的管理员等等……那么不同的管理员(角色)所能做的操作以及能看到的菜单应该是不一样的,比如一个商品的后台管理系统,业务模块的管理员需要维护一些商品的上下架,商品的促销等,财务模块的管理员并不需要对商品数据模块进行这些维护工作,这个时候就需要在财务角色的后台管理系统中隐藏那些功能……原创 2024-05-15 21:15:00 · 1094 阅读 · 0 评论 -
Vue 之 在当前页面的实现分页效果
这是因为计算属性的一个特性:计算属性相比监听而言,计算属性具有缓存特性,直白的说,计算属性的依赖(也就是计算属性中所用到的变量)如果不变,那么计算属性不会被再次调用,从而进一步的提高性能。可以将空白内容作为一个table的某一页数据,然后点击底部的分页组件的上一页或者下一页,来做到数据的切页效果。上述图片的空白内容是活动的,由下面的两个按钮控制上一页、下一页;点击按钮切换页码,监听页码的变化获取到当前页的数据,从而渲染到页面上。中的一个综合table来看下效果图。注意点,这里建议使用计算属性。原创 2024-05-01 22:15:24 · 554 阅读 · 0 评论 -
Vue 之 父组件给子组件传参实现自定义弹窗组件
Vue 之 父组件给子组件的传参的另类方式实现自定义弹窗组件原创 2022-09-12 19:01:32 · 2527 阅读 · 0 评论 -
Vue 之 vuex 解决刷新页面 state 数据丢失的问题,使用vuex-persistedstate进行state持久化
vuex 解决刷新页面 state 数据丢失的问题:1、使用本地存储storage;2、或者使用vuex-persistedstate进行state持久化。原创 2022-02-08 20:25:50 · 2007 阅读 · 0 评论 -
Vue 之 获取并修改元素样式(比如案例取色器的实现)
Vue 之 获取并修改元素样式(经典案例取色器)一、利用原生 js二、利用 Vue的 `v-bind` 指令和 `ref` 属性一、利用原生 js利用相关dom api 取到元素(如果你的项目中引入了 jQuery,也可以使用 jq 的 api ),这里使用的是原生的;注:如果你使用的是单个样式修改的是带中横线的样式属性(如 margin-top),那么代码中的样式需要修改成驼峰格式的(如 marginTop );多个样式的写法可使用模板字符串(反引号),使用模板字符串的写法不用将中横线的样式属性原创 2021-11-21 22:47:56 · 10022 阅读 · 0 评论 -
Vue 之 下载本地资源文件
利用 a 标签实现,这里需要注意的是:我们这里的本地资源文件是放在 public 下的(不建议放在 assets 目录下);这里需要区分生产环境和开发环境,如果你的项目部署到服务器上的某个目录下(比如 test 目录下),那么你需要在给 a 标签绑定路径的时候也是需要做下区分的,开发环境直接 / 就可以,但是部署到生产环境之后一定要在你的路径前面加上你项目部署的那个目录名称(如代码所示);封装一个方法:let prefixUrl = process.env.NODE_ENV === 'produ原创 2021-11-14 12:06:33 · 3471 阅读 · 0 评论 -
Vue 之 利用new Blob() 对后端返回文件流 或 base64字符串下载导出文件时不同文件类型的 type 值整理及函数封装调用示例
在 Vue 项目中,经常用 Blob 二进制进行文件下载功能,涉及不同后缀名的文件,这里整理一份 Blob 的配置关系对应表,在我们使用Blob做下载功能时 ,根据需要下载的文件类型修改 type 值进行下载即可。 后缀名文件类型类型(type).aacAAC 音频audio/aac.abwAbiWord 文档application/x-abiword.arc存档文档(多个文件嵌入)applica...原创 2021-10-31 14:04:00 · 18590 阅读 · 3 评论 -
Vue 之 vur-router 路由常用的几种传参方式
路由常用的几种传参方式以及各自的区别原创 2021-09-24 22:51:52 · 276 阅读 · 0 评论 -
Vue 之 this.$store.dispatch() 与 this.$store.commit()方法的区别
this.$store.dispatch()与 this.$store.commit()方法的区别总的来说他们只是存取方式的不同,两个方法都是传值给vuex的mutation改变statethis.$store.dispatch() :含有异步操作,例如向后台提交数据,写法:this.$store.dispatch(‘action方法名’,值)this.$store.commit():同步操作,,写法:this.$store.commit(‘mutations方法名’,值)commit: 同步操作转载 2021-09-24 22:19:07 · 792 阅读 · 1 评论 -
Vue 之 组件之间的传值通信(多种方法,简洁而不失重点)
Vue 之 组件之间的传值通信子组件使用父组件的数据、方法;父组件使用子组件的数据、方法;原创 2021-04-19 21:26:11 · 1196 阅读 · 3 评论 -
Axios 请求拦截器以及响应拦截器的封装
本文就简单的对Axios 请求拦截器以及响应拦截器的封装 进行代码的编写:import axios from 'axios'let baseURL_dev = 'http://localhost:8080' // 开发环境// let baseURL_pro = '' // 公司域名// let baseURL_test = '' // 内网地址// 创建axios实例const fetch = axios.create({ baseURL: baseURL_dev, timeo原创 2020-07-17 10:45:34 · 768 阅读 · 0 评论 -
Vue 之 Vue 的基础知识汇总 —— 总结一
什么是 Vue 以及 Vue 的基础知识 —— 总结一一、插入内容{{Mustache}} 、 v-cloakv-textv-htmlv-prev-once二、条件判断v-ifv-else 、 v-else-ifv-show三、遍历循环v-for四、动态绑定属性v-bind五、事件绑定v-on六、v-modelv-model的初体验v-model 在复选框中的使用v-model 在单选框中的使用v-model 在单选下拉选框中的使用v-model 在多选下拉选框中的使用v-model 的修饰符一、插入内容原创 2020-06-25 12:23:11 · 377 阅读 · 0 评论