![](https://img-blog.csdnimg.cn/20201014180756724.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
文章平均质量分 64
何小玍。
这个作者很懒,什么都没留下…
展开
-
不同vue版本下如何分环境打包
前言假如你的Vue项目需要在多个服务器部署,若使用代理的模式,每个环境都需要先改IP地址及端口,再打包,非常的麻烦vue2版本(基于webpack)的动态ip及端口分环境打包在public目录下,新建config.js文件在config.js文件中编写对应的分别打包环境把config.js在index.html中引入创建对应的 .env.dev , .env.sit , .env.prod 三个环境在每个环境中写入对应的环境变量处理package.json中的sc原创 2022-04-13 21:47:04 · 1764 阅读 · 0 评论 -
vue3导入excel并转化成数组
示范excel的demo先导入xlsxnpm install xlsximport * as XLSX from "xlsx"; // vue3可用此引入上传组件用了element-plus的el-upload组件<template> <el-upload class="upload-demo" action="" drag :auto-upload="false" :on-change="uploadChange" :li原创 2022-04-04 19:17:45 · 2102 阅读 · 1 评论 -
vue实现用户登录验证 + 权限验证 + 动态路由(左侧菜单栏)
1. 技术栈说明vue2.6 + vue-router + vuex + element-ui2. 开始:新建项目前提条件:在个人电脑上安装好nodejs(我的是14.15.1)之后,利用nodejs自带的npm包管理器安装好vue(我的是@vue/cli 4.5.12)在命令行中通过以下指令在指定目录下安装脚手架vue-clinpm install -g @vue/cli使用vue的创建项目命令,vue create xxx (xxx是指项目名称)选择项目所需要的插件.原创 2022-04-02 07:08:23 · 5810 阅读 · 4 评论 -
什么是状态管理工具?(vuex)
直接使用全局对象的问题全局对象里面的数据是普通的JavaScript数据类型,它们不是响应式的,也就说第一次读取渲染有可能没有问题,但是当数据修改过以后,界面没法作出对应的更新,这是一个很大的问题全局对象的修改无法追踪,也就是说在应用中的任何一处代码,都可以有机会拿到全局数据,并作出对应的修改,但是我们根本没有办法搞清楚是哪行代码,哪个文件修改了全局数据,这样就非常容易产生bug,而且难以追踪,这就很危险了。vue是组件化的世界,就像我们的程序,大家也可以发现,组件的构成就像一棵树一样,全局数据一般是从父组原创 2021-08-21 07:16:54 · 223 阅读 · 0 评论 -
vue3+ts,后端:koa2+jwt,实现登陆功能(后端部分下篇)
# 前端:vue3+ts,后端:koa2+jwt,实现登陆功能(后端部分上篇)1. 在routes里面,创建一个user.js文件,用作登陆的后端文件/** * 用户管理模块 */const router = require('koa-router')() // koa路由文件const User = require('../models/userSchema') // schema文件 定义user用户的字段的const util = require('../utils/util') //原创 2021-08-17 09:17:11 · 318 阅读 · 0 评论 -
前端:vue3+ts,后端:koa2+jwt,实现登陆功能(前端部分)
准备工作搭建项目和一些基础的封装准备# vue3+ts项目搭建和封装(上篇)# vue3+ts项目搭建和封装(下篇)搭建页面我是用了vue3+element-plus来搭建的项目,所以登陆也是用了element-plus的el-form组件页面骨架部分<template> <div class="login-wrapper"> <div class="modal"> <el-form :model="user" status-ic原创 2021-08-16 07:45:08 · 391 阅读 · 0 评论 -
vue3+ts项目搭建和封装(下篇)
# vue3+ts项目搭建和封装(上篇)配置request.ts/** * axios 二次封装 * @auther 何小生。 * @time 2021/08/05 05:24*/import axios from 'axios' // 引入axiosimport { config } from '../config' // 引入configimport { ElMessage } from 'element-plus' // 引入element-plusimport rout原创 2021-08-11 06:55:07 · 1463 阅读 · 0 评论 -
vue3+ts项目搭建和封装(上篇)
1. 首先,要确保自己的node版本 >= 12.0.0, 在命令行执行node-v就可以查看node版本如果node版本低于12的话,就…node有一个模块叫n,是专门用来管理node.js的版本的。第一步:首先安装n模块:npm install -g n第二步:升级node倒最新稳定版n stable(n后面也可以跟版本号)n v14.15.1或者n 14.15.1## 就完事儿了2. 开始搭建项目首先进入需要创建项目的路径下使用npm: npm init @vi原创 2021-08-10 07:46:00 · 1685 阅读 · 1 评论 -
Vue实现动态路由
通常我们在vue项目中都是前端配置好路由的,但在一些项目中我们可能会遇到权限控制,这样我们就涉及到动态路由的设置了。动态路由设置一般有两种:(1)、简单的角色路由设置: 比如只涉及到管理员和普通用户的权限。通常直接在前端进行简单的角色权限设置(2)、复杂的路由权限设置: 比如OA系统、多种角色的权限配置。通常需要后端返回路由列表,前端渲染使用1、简单的角色路由设置(1)配置项目路由权限// router.jsimport Vue from 'vue'import Router fro原创 2021-08-09 06:58:52 · 3306 阅读 · 0 评论 -
前端:vue3 + ts,后端:koa2。实现jwt登陆校验 (上篇 -前端部分)
1. 首先,要确保自己的node版本 >= 12.0.0, 在命令行执行node-v就可以查看node版本如果node版本低于12的话,就...node有一个模块叫n,是专门用来管理node.js的版本的。第一步:首先安装n模块:npm install -g n第二步:升级node倒最新稳定版n stable(n后面也可以跟版本号)n v14.15.1或者n 14.15.1## 就完事儿了2. 开始搭建项目首先进入需要创建项目的路径下使用npm: npm init @原创 2021-08-05 08:29:39 · 523 阅读 · 0 评论 -
vue实现多接口轮询,并把json打包成json文件且压缩为zip包
实际需求产品小哥哥需要把一堆json文件根据对应的API文件名打包成对应的名称的json包,然后装在一起并压缩成zip格式的压缩包,下载下来先分解需求先根据多个json文件的api,获取到对应的json文件把对应的json文件分门别类的方法,并赋予对应的名称json文件解码并放在一个文件夹下进行zip压缩难点多个json的api接口同时请求,并需要捕获哪个接口请求失败json文件里的中文字符下载到本地时的乱码问题jszip和file-saver的使用这里需要用到三个技术难点promise.all:这个来做多原创 2021-08-01 22:43:05 · 998 阅读 · 0 评论