- 博客(9)
- 收藏
- 关注
原创 vue.cli项目封装全局axios,请求封装,封装公共的api和调用请求
vue.cli项目封装全局axios,封装请求,封装公共的api和调用请求的全过程正文1.vue项目的前期配置新建vue的项目,下载axios ,并且在main.js中导入axiosnpm i axios -S//main.jsimport axios from "axios"2.配置config文件中的带地址vuecli 3+ 新版本的代理配置 - vue.config.js文件关于代理配置 devServer: { overlay: { // 让浏览器 o
2020-10-15 10:55:59
2272
转载 axios+ token +refreshToken
axios+ token +refreshToken需求前端登录后,后端返回token和refresh_token,当token值过期的时候就用refresh_token去获得新的token思路为了防止多次刷新token值,如果refreshToken的接口还没有返回,此时如果再有一个请求进来,会再次执行refreshToken ,这样就会导致多次执行刷新token的接口,因此需要防止这个问题,我们可以在request.js中使用一个参数例如flag来标记当前是否为正在刷新的状态,如果正在刷新则不在
2020-07-20 17:12:00
1652
原创 vue + element ui实现多语言切换
vue + element ui实现多语言切换首先我们创建一个lang的文件 ,里面创建三个文件index.js(引入使用i18n模块), en.js(英文包), zh.js(中文包)… 其他语言的包index.js 文件:import Vue from 'vue' // 引入vueimport VueI18n from 'vue-i18n' // 引入i18n模块import Cookies from 'js-cookie' // 封装了获取,设置,删除cookie的方法import elem
2020-07-20 15:02:51
1214
原创 vue-cli3.0 + sass/scss项目
vue-cli3.0 集成sass/scss到vue项目第一种创建项目是选择预处理器sass手动安装 sass-loader$ vue create vuedemo? Please pick a preset: (Use arrow keys)> default (babel, eslint)Manually select features移动选择“Manually select features” :表示手动选择创建项目的特性? Check the features needed
2020-07-20 14:11:08
466
转载 vue-cli3.0的vue.config.js配置
vue-cli3.0的vue.config.js的配置module.exports = { // 基本路径 baseUrl: '/', // 输出文件目录 outputDir: 'dist', // eslint-loader 是否在保存的时候检查 lintOnSave: true, // use the full build with in-browser compiler? // https://vuejs.org/v2/guide/installation.html#Runtime-
2020-07-20 13:28:02
437
原创 vue cli3.0 搭建项目步骤
vue cli3.0快速搭建1.卸载安装a.首先卸载就的版本的vue-cli(1.x 或者2.x) ,如果不是在跳过此步骤1 npm uninstall vue-cli -g //或者 yarn global remove vue-clib. 由于Vue cli3 需要nodeJs>=8.9 的版本(官方是推荐8.11.0+)下载nodeJS 下载地址: http://nodejs.cn/download/c.安装@vue/clicnpm install -g @vue/cli //
2020-07-20 11:32:03
265
原创 vue 记住密码 + 密码加密解密
vue 登录 + 记住密码 + 密码加密解密使用crypto-js加解密第一步,安装npm install crypto-js第二步,在你需要的vue组件内importimport CryptoJS from “crypto-js”;第三步,使用// Encrypt 加密var cipherText = CryptoJS.AES.encrypt("my message","secretkey123").toString();console.log(cipherText)// Dec
2020-07-18 17:10:19
619
转载 el-dialog拖动
el-dialog拖动1.drag.jsimport Vue from 'vue'/** 使用方法* 将以下代码复制到一个js文件中,然后在入口文件main.js中import引入即可;* 给elementUI的dialog上加上 v-dialogDrag 指令就可以实现弹窗的全屏和拉伸了。* 给dialog设置 :close-on-click-modal="false" , 禁止点击遮罩层关闭弹出层* 如果是form表单,不要将提交等按钮放置el-form-item,以免在上下
2020-07-18 15:51:47
773
转载 lib-flexible适配大屏方案(附移动端适配)
lib-flexible适配大屏方案(附移动端适配)1.移动端的适配步骤 一般而言, lib-flexible并不独立出现,而是搭配 px2rem-loader一起做适配方案,目的是自动将css中的px转换成rem。以下为它在vue中的使用。2.1 安装 lib-flexiblenpm install lib-flexible --save-dev2.2 引入 lib-flexible在 main.js中引入lib-flexible// px2rem 自适应import ‘lib-flexib
2020-07-18 15:10:30
1169
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人