VUE - 随笔分类 - QiKS

二十八、Vue的防抖和节流

摘要：节流函数 //节流:一段时间内，只执行一次某个操作;过了这一段时间，还有操作的话继续执行新的操作 export function throttle (fn, time) { // 记录该函数是否已经执行, 利用闭包特性延长变量生命周期，当setTimeout执行完timer才为空 let timer 阅读全文

posted @ 2022-06-14 01:06 QiKS 阅读(48) 评论(0) 推荐(0)

二十七、Vue2-editor使用post传输，传输头过大报413解决方法

摘要：前端修改：此路径 node_modules/.bin/vue-cli-service.cmd 中的文件加入 "%_prog%" "--max-http-header-size=10000000" "%dp0%\..\@vue\cli-service\bin\vue-cli-service.js" 阅读全文

posted @ 2022-06-07 22:51 QiKS 阅读(456) 评论(0) 推荐(0)

二十六、Vuex异步获取数据的步骤

摘要：Vuex封装使用 import { getInfo } from "../../api/user" //axios二次封装接口的导入 import { getToken } from '@/utils/auth' //获取token //vuex的基本数据，state用来存储变量 const sta 阅读全文

posted @ 2022-06-02 23:52 QiKS 阅读(571) 评论(0) 推荐(0)

二十五、Vue常用操作数组方法

摘要：①arr.reverse() 获取倒序数组数据，改变原数组 arr.reverse() ②arr.length 数组长度 var l=arr.length ③arr.slice(start,end) 数组截取 start开始截取下标，end结束截取下标，返回一个新数组（不包括end）（浅拷贝） v 阅读全文

posted @ 2022-05-30 23:38 QiKS 阅读(846) 评论(0) 推荐(0)

二十四、Vue插件富文本编译器vue2-editor

摘要：下载vue2-editor 组件内使用vue2-editor插件 <template> <div class="EditAndAdd"> <div class="form"> <el-form label-width="120px" style="margin-top: 20px; color: b 阅读全文

posted @ 2022-05-30 23:16 QiKS 阅读(1298) 评论(0) 推荐(0)

二十三、Vue-template-admin反向代理的配置

摘要：反向代理原生测试访问h ttp://localhost:9528/#/dashboard 原生测试访问http://192.168.0.101:9528/#/dashboard 阅读全文

posted @ 2022-05-25 14:51 QiKS 阅读(95) 评论(0) 推荐(0)

二十二、Vue文件手动上传（普通存储、base64存储）

摘要：文件上传到后端 axios二次封装使用 //头像上传 export function avatarUpload (userFrom) { return requests({ url: '/test/72b88c04309911ec8d3d0242ac130003/v1_0_0/testprovide 阅读全文

posted @ 2022-05-13 11:15 QiKS 阅读(317) 评论(0) 推荐(0)

二十一、vue.config.js配置（上线清除报错、脚手架校验工具关闭、反向代理）

摘要：上线清除报错校验工具关闭反向代理 devServer: { // proxy: "https://www.camptogo.com" proxy: { // 代理 '^/': { target: 'https://www.camptogo.com',// 连接后端跨域配置跨域 changeOri 阅读全文

posted @ 2022-05-08 21:03 QiKS 阅读(160) 评论(0) 推荐(0)

二十、vue的表单验证插件vee-validata使用

摘要：下载插件使用插件 main.js引入插件的使用密码确认协议同意 methods中进行注册验证阅读全文

posted @ 2022-05-08 20:18 QiKS 阅读(73) 评论(0) 推荐(0)

十九、图片懒加载vue-lazyload插件使用

摘要：插件下载插件引入main.js 插件使用阅读全文

posted @ 2022-05-08 11:26 QiKS 阅读(32) 评论(0) 推荐(0)

十八、Vue-routes的基本使用((菜单栏、路由传参、路由跳转多页面开、路由引入区别)

摘要：菜单栏一、Vue-routes的二级路由的配置二、路由携带辨识变量（例如：导航栏在那个页面显示的控制）三、vue-routes的跳转显示四、路由重定向路由传参 query传参（地址栏可见）编程式 this.$router.push({ path: "/Details", query: { 阅读全文

posted @ 2022-05-06 22:44 QiKS 阅读(668) 评论(0) 推荐(0)

十七、Vue导航卫士（全局、独享、组件例子：用户登录）

摘要：全局守卫（常用）未登录访问交易相关（trade)、支付相关（pay、paysuccess)、用户中心(center)相关跳转到登录页面或要登录的指定页面指定页面独享守卫（常用）只有从购物车界面才能跳转到交易页面(创建订单)，只有从交易页面（创建订单）页面才能跳转到支付页面，只有从支付页面才能阅读全文

posted @ 2022-04-27 23:40 QiKS 阅读(45) 评论(0) 推荐(0)

十六、Vue的uuid模拟token请求头请求数据

摘要：token使用流程：登录后端返回token vuex引入token身份码全局管理并且本地存储token axios二次封装中给http数据请求头加上token身份码再向后端请求用户信息登录退出流程：清除本地存储的token 通知后端清除存储的token 下载uuid 建立uuid生成token身份阅读全文

posted @ 2022-04-22 11:12 QiKS 阅读(128) 评论(0) 推荐(0)

十五、排它动态使用样式写法

摘要：阅读全文

posted @ 2022-04-19 15:48 QiKS 阅读(7) 评论(0) 推荐(0)

十四、Vue解决路由跳转滚动条位置不变

摘要：让路由跳转时默认滚动条在最上方阅读全文

posted @ 2022-04-19 11:17 QiKS 阅读(288) 评论(0) 推荐(0)

十三、swiper轮播图插件使用

摘要：下载swiper插件 main.js导入swiper样式组件引入swiper包异步时new swiper实例（swiper使用必须new swiper实例）不完美解决方案完美解决方案阅读全文

posted @ 2022-04-14 20:03 QiKS 阅读(42) 评论(0) 推荐(0)

十二、模拟数据mockjs插件使用

摘要：导入插件在src新建mock数据文件夹，导入json模拟数据建立mockserver.js 文件导入json数据主main.js文件引入mockserver.js文件运行 axios二次封装，访问路径src改成mock文件数据接口路径（正常axios二次封装使用）接口访问调用阅读全文

posted @ 2022-04-14 13:19 QiKS 阅读(64) 评论(0) 推荐(0)

十一、性能优化（事件委托、路由赖加载、根组件App发一次请求）

摘要：事件委托事件委托也叫事件代理，“事件代理”即是把原本需要绑定在子元素的响应事件（click、keydown…）委托给父元素，让父元素担当事件监听的职务。事件代理的原理是DOM元素的事件冒泡。事件委托的好处： 1.减少事件数量，提高性能 2.预测未来元素，新添加的元素仍然可以触发该事件 3.避免阅读全文

posted @ 2022-04-13 12:54 QiKS 阅读(43) 评论(0) 推荐(0)

十、vue二次封装axios

摘要：下载axios cnpm install --save axios 新建项目配置axios二次封装文件reques.js //对axios进行二次封装 import axios from "axios"; //1:利用axios对象的方法create，去创建一个axios实例 //2:reques 阅读全文

posted @ 2022-04-10 21:33 QiKS 阅读(212) 评论(0) 推荐(0)

九、vuex模块化开发

摘要：下载vuex npm install vuex@3 创建vuex文件并引入vuex代码 modules const state = {}; const mutations = {}; const actions = {}; const getters = {}; export default { s 阅读全文

posted @ 2022-04-10 21:29 QiKS 阅读(65) 评论(0) 推荐(0)

随笔分类 - VUE