![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
Time202051
这个作者很懒,什么都没留下…
展开
-
拼图验证 vue-puzzle-vcode
https://blog.csdn.net/qq_37816525/article/details/102560656转载 2022-04-01 15:49:11 · 803 阅读 · 0 评论 -
通过require.context(‘./‘, true, /\.vue$/) 和Vue.extend( ) 实现vue页面的渲染
原创 2022-02-18 15:42:33 · 627 阅读 · 0 评论 -
require.context( )获取.vue文件所有内容
const files = require.context('路径',是否包含子项, 正则.vue) //获取的所有.vue结尾的文件files.keys() 拿到所有的路径,就是他们的keyfiles(item).default.age就可以获取在vue文件全局的数据files(item).default.data() 就可以获取vue2文件data区域的数据...原创 2022-02-18 15:11:04 · 1373 阅读 · 0 评论 -
导入文件时候 new FormData()
formData中append数组的时候要JSON.stringify(arr) 否者直接arr会变成字符串 const files = e.target.files const formdata = new FormData(); formdata.append("file", files[0]); //注意 Object.keys(obj).forEach(item=>{ formdata.append(item, JSON.stringify(arr)) })原创 2022-02-14 09:53:23 · 658 阅读 · 0 评论 -
vue从上到下淡入淡出过渡动画
从上往下的淡入淡出的过渡/* 开始 *///dialogFade 是容器的类名 <div class="dialogFade"></div>.dialogFade-enter,.dialogFade-leave-to { opacity: 0; transform: translateY(-30px);}/* 过程 */.dialogFade-enter-active { transition: all 0.5s;}/* 结束 */.dialogFad原创 2021-11-16 18:12:17 · 2178 阅读 · 0 评论 -
vue3 ts 封装Axios
npm i axiosimport axios from 'axios';import { AxiosInstance, AxiosRequestConfig } from 'axios';// 将axios封装到类中class Http{ instance: AxiosInstance; // axios的实例将被保存到这里 constructor(config: AxiosRequestConfig) { // 构造器里的config包括baseURL,timeout等原创 2021-10-11 18:16:53 · 689 阅读 · 0 评论 -
vue 销毁定时器
定时器是挂载在window上的即使vue页面销毁,也无法销毁window上的定时器。要手动关闭 // 定时器 更新 服务器时间 setTimer() { this.timer = setInterval(() => { // 写具体定时逻辑 }, 2000); } clearInterval(this.timer); // 销毁定时器...原创 2021-09-30 13:55:58 · 348 阅读 · 0 评论 -
css变量在页面中的使用,实现页面变量赋值给css中
// '--hoverColor'这个是css中var声明的变量,页面直接给其赋值就可以 <el-table :data="tableList" row-key="id" border default-expand-all :row-style="{ backgroundColor: themeData[theme].table.body.backgroundColor }"原创 2021-09-30 09:24:14 · 590 阅读 · 0 评论 -
ant desigin vue之 tree(树形控件)中设置defaultExpandAll无效的问题
https://blog.csdn.net/longgege001/article/details/108398660转载 2021-09-27 18:26:24 · 400 阅读 · 0 评论 -
vue3 导入导出json文件
导入json // 这是选择本地文件的弹框 这里display:none隐藏了,DOM依旧存在 <input type="file" id="files" ref="refFile" style="display: none" v-on:change="fileLoad" />获取DOM,触发他的点击事件 const refFile = ref(null); const addFileHandle = () => {原创 2021-09-27 18:20:10 · 3269 阅读 · 0 评论 -
vue3 element-plus 中文
https://element-plus.org/zh-CN/guide/i18n.html#configprovider官网国际化 <el-config-provider :locale="locale"> <router-view /> </el-config-provider>import { ElConfigProvider } from 'element-plus' components: { // Main ElConf原创 2021-09-26 18:42:21 · 3941 阅读 · 0 评论 -
vue3 网络请求添加loading
全局添加import axios from 'axios'import { ElLoading } from 'element-plus'let loadingRequestCount = 0let loadingInstanceconst showLoading = () => { if (loadingRequestCount === 0) { loadingInstance = ElLoading.service({ target: '#app' }) } loa原创 2021-09-26 15:58:38 · 1592 阅读 · 0 评论 -
elementui utils/clickoutside.js 点击元素外部触发
这是elementui框架点击元素外部触发的自定义指令。我们要手动绑定mian.jsimport clickoutside from 'element-ui/src/utils/clickoutside'Vue.directive('clickoutside', clickoutside)使用 v-clickoutside=“handlerOutside” 这样点击元素外部就会执行...原创 2021-08-23 10:21:41 · 529 阅读 · 0 评论 -
数组无缝滚动demo
<template> <div> <vue-seamless-scroll :data="alarmdata" class="seamless-warp" :class-option="classOption" > <div v-for="(item, index) in alarmdata" :key="index"> <div>{{ item.name }}&l原创 2021-08-17 15:31:40 · 194 阅读 · 0 评论 -
el-table表格的拖拽 sortablejs
npm install sortablejs --save <el-table :data="tableData" style="width: 100%" > <el-table-column prop="date" label="日期" width="180"></el-table-column> <el-table-column prop="name" label="姓名" width="180"></el-tabl原创 2021-06-30 17:36:13 · 115 阅读 · 0 评论 -
vue eventBus 兄弟组件之间的传值
main.js入口文件Vue.prototype.$EventBus = new Vue();向EventBus插入数据this.$EventBus.$emit('dataB', this.dataB)消费eventBus数据this.$EventBus.$on('dataB', (res) => { this.dataA = res})销毁this.$EventBus.$off('dataB');原创 2021-04-26 15:49:07 · 229 阅读 · 0 评论 -
Vuex Modules模块化的基本操作
下面是Vuex的目录结构Vuex的state类似就是存储数据的地方,如果项目数据结构复杂,vuex的数据全都写在同一个state中难以维护。所以模块化开发将其按照一个一个的模块划分,每个模块都有自己的state,mutations,actions 在export default暴露出去导入到store/index.js统一再暴露出去//import导入文件部分省略Vue.use(Vuex)const store = new Vuex.Store({ modules: { app,原创 2021-04-26 14:02:33 · 291 阅读 · 0 评论 -
vue 配置axios 封装接口
src/utils/request.js 请求头 ,请求拦截器,响应拦截器import axios from 'axios'const service = axios.create({ baseURL: process.env.BASE_API, timeout: 3 * 1000})service.interceptors.request.use(config => { config.data = JSON.stringify(config.data); co原创 2020-12-18 13:29:14 · 2020 阅读 · 1 评论