项目需求
勤奋的代码搬运工
这个作者很懒,什么都没留下…
展开
-
Vue3实现文件预览word、pdf、excel、图片以及txt文件
纯js实现docx、xlsx、pdf、txt、图片等文件预览库,使用超简单原创 2023-12-21 17:42:11 · 11344 阅读 · 3 评论 -
封装axios请求(拦截器)
axios.js下封装拦截器。vue+vite项目目录。music.js封装请求。原创 2022-08-10 15:35:06 · 264 阅读 · 0 评论 -
纯CSS实现tab切换
点击tab切换方式有二一、通过a标签的锚点 + :target选择器缺点:锚点会将选中的元素滚动到页面最上面,每次切换位置都要移动,体验极差。二、利用label和radio的绑定关系和radio选中时的:checked来实现效果以下为方法二CSS样式HEML...原创 2022-07-12 10:08:06 · 2981 阅读 · 0 评论 -
【vite+vue通过@便捷引入路径的配置方法】
vite+vue通过@便捷引入路径的配置方法原创 2022-06-22 14:58:39 · 1843 阅读 · 0 评论 -
【vite+Vue3项目的创建以及配置项】
vite+vue项目创建以及配置原创 2022-06-22 14:56:54 · 602 阅读 · 0 评论 -
【vue3动态的切换earchs图表的数据】
1、首先进行下载模块我这里通过yarn add echarts,当然也可以使用npm i echarts2、然后在main里进行引入全局的3、组件内进行使用earchs创建实例注意:这里在虽然给绑定的数据进行创建变量便于切换,但是实例已经创建,所以需要进行销毁,否则会报下面这个错误4、接下来就是代码htmljavascriptcss...原创 2022-06-21 10:59:08 · 1357 阅读 · 0 评论 -
前端以字节流形式下载pdf文件
前端以字节流形式下载pdf文件html内容写入点击事件,传入路径后端返回字节流格式<template> <el-button type="text" @click="saveEditIn(url)" >下载 </el-button ></template><script>// 点击下载操作 const saveEditIn = (e) => { api .downlo原创 2022-03-23 14:40:11 · 2124 阅读 · 0 评论 -
【Vue3通过公共状态VueX实现组件通信】
Vue3通过公共状态VueX实现组件通信Vue3通过公共状态VueX实现组件通信Vue3通过公共状态VueX实现组件通信作用:对于组件之间的通信,除了父子间通过props,或者通过provide和inject,亦或者通过bus方式,我觉得公共状态的使用更加方便谁使用谁引用就可以首先src文件夹下新建store文件夹,内部index.js文件进行创建公共资源库import { createStore } from "vuex"; export default createStore({原创 2022-03-01 11:46:08 · 492 阅读 · 0 评论 -
【vue 进行路由跳转,刷新页面后页面没有刷新】
vue 进行路由跳转,刷新页面后页面没有刷新vue 进行路由跳转,刷新页面后页面没有刷新vue 进行路由跳转,刷新页面后页面没有刷新项目实例:如点击歌手进行跳转歌手详情,或者点击歌手返回所以歌手列表等问题:vue-router提供了页面路由功能,可以用来构建单页面应用,在使用vue-router的动态路由匹配的时候,遇到了url变化了,但是页面却没有任何动静的问题动态路由匹配url变化了,但是组件没有变化是因为vue进行了组件复用,因为两个路由都渲染同个组件,比起销毁再创建,复用则显得更加高效。不过原创 2022-02-09 14:43:19 · 6172 阅读 · 0 评论 -
【Vue原生input输入框上传文件】
Vue原生input输入框上传文件Vue原生input输入框上传文件Vue原生input输入框上传文件<template> <div> <el-button type="primary"> <a href="http://xxx.xlsx">导入模板下载</a> </el-button> <el-button type="primary" @click="$refs.filesRef.click()"&原创 2022-01-19 17:36:06 · 1187 阅读 · 0 评论 -
导航栏点击进入路由跳转详情页导航样式失效
导航栏点击进入路由跳转详情页导航样式失效el-menu解决导航样式失效的问题el-menu解决导航样式失效的问题项目问题:两个同级的导航栏页面,一个主页面(/text),一个详情页(/detail 导航栏false隐藏),当点击进入详情是路由跳转/detail,所以/text的导航样式失效解决办法:进行路由拦截判断,保留样式导航栏代码<template> <div > <el-menu class="sidebar-menu" :原创 2021-12-31 17:18:13 · 1264 阅读 · 2 评论 -
禁止抽屉el-drawer点击内容区域外关闭
禁止抽屉el-drawer点击内容区域外关闭element组件禁止抽屉el-drawer点击内容区域外关闭element组件禁止抽屉el-drawer点击内容区域外关闭**只需添加方法 :close-on-click-modal=“false” **<el-drawer title="标题" v-model="data" direction="rtl" size="30%" :close-on-click-modal="f原创 2021-12-31 10:45:34 · 4312 阅读 · 4 评论 -
Vue项目封装管理api
Vue项目封装管理apiVue项目封装apiVue项目封装apiVue项目的开发会用到许多、且重复使用的api,所以合理的api管理会减少代码量,也便于后期的更改1、首先需要在src文件夹下新建一个http文件夹2、http文件下新建axios.js文件进行管理axios请求3、http文件下新建api.js文件进行管理api项目目录如下:axios.js代码// axios 需要下载模块npm i axios import axios from 'axios'// 创建axios的原创 2021-12-15 16:53:01 · 1224 阅读 · 0 评论 -
解决ElementUi树结构默认选中的事件
解决ElementUi树结构默认选中的事件解决ElementUi树结构默认选中的事件解决ElementUi树结构默认选中的事件一个后台管理系统,使用了ElementUi的el-tree组件,并且带有选中效果的,当对数据进行修改操作时,需要将原有的选中数据渲染到树结构中,data以及default-checked-keys的数据都是从后台获取的数据,所以在进行修改操作时,并没有按照预期的能把选中的效果体现出来,后来一想才发现,原来渲染el-tree前,就得拿到default-checked-keys的选中转载 2021-12-03 17:16:19 · 2888 阅读 · 1 评论 -
Vue项目element-ui弹窗组件el-dialog、el-drawer,阻止点击遮罩层关闭
项目需求问题Vue项目element-ui弹窗组件el-dialog、el-drawer,阻止点击遮罩层关闭Vue项目element-ui弹窗组件el-dialog、el-drawer,阻止点击遮罩层关闭在使用element-ui组件的时,根据项目需求,需要修改组件默认的属性值。今天根据需求需要组织点击遮罩层关闭组件el-dialog或者el-drawer<el-dialog :title="title" :visible.sync="open" width="500p原创 2021-12-02 17:15:34 · 3962 阅读 · 0 评论 -
Git团队开发
团队开发GitGit的使用GitGit的使用1. 安装git2. 自报家门git config --global user.name "Your Name"git config --global user.email "email@example.com"3. git命令创建git可管理的仓库 git init添加+提交 git add . git commit -m “提交说明”撤销更改 git checkout . 撤销更改版本回退 git reset --hard原创 2021-11-19 11:43:09 · 152 阅读 · 0 评论