Vue开发
关注
分享
扫一扫
文章平均质量分 61
关于VUE框架的使用
智江鹏
奇奇怪怪的我
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
vue-vant使用
安装和配置# Vue 2 项目，安装 Vant 2：npm i vant -S # Vue 3 项目，安装 Vant 3：npm i vant@next -S自动按需引入组件（安装了就可以省略）配置babel-plugin-import插件，它会在编译过程中将 import 的写法自动转换为按需引入的方式（官方推荐做法）# 安装插件npm i babel-plugin-import -D改配置plugins在项目.babelrc 文件或者babel....原创 2022-05-18 15:47:34 · 2538 阅读 · 0 评论 -
vue-cli 脚手架 2和3
介绍Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统。 使用Vue 脚手架之后我们开发的页面将是一个完整系统(项目)环境准备# 1.下载nodejs http://nodejs.cn/download/ windows系统: .msi 安装包(exe)指定安装位置 .zip(压缩包)直接解压缩指定目录 mac os 系统: .pkg 安装包格式自动配置环境变量 .tar.gz(压缩包)解压缩安装到指定名# 2.配置nodej...原创 2022-05-17 10:27:26 · 672 阅读 · 0 评论 -
bootstrop整理
BootStrap模板<!DOCTYPE html><html lang="en"> <head> <!--设置当前HTML文件的字符编码--> <!--compatible兼容的，设置浏览器的兼容模式版本（让IE使用最新的渲染引擎工作）--> <!--声明当前网页在移动端浏览器展示的相关设置--> <!-- viewport表示用户是否可以缩放页面 width指定视区的逻辑.原创 2022-05-09 15:52:42 · 546 阅读 · 0 评论 -
jwt使用
整个流程客户端工作1.将服务器下发的token保存到本地，然后在接下里的网络请求（将token加入到请求头中）发送给服务器服务器端工作1.下发token,解析token实际应用1.在登录验证通过后，给用户生成一个对应的随机token(注意这个token不是指jwt，可以用uuid等算法生成)，然后将这个token作为key的一部分，用户信息作为value存入Redis，并设置过期时间，这个过期时间就是登录失效的时间2.将第1步中生成的随机token作为JWT...原创 2022-05-07 10:01:29 · 269 阅读 · 0 评论 -
tomcat部署vue前端项目
Tomcat建立文件夹1.在webapps文件夹下建立JL文件夹Vue项目修改请求的公共路径1.vue.config.js修改打包时的公共路径publicPath: process.env.NODE_ENV === "production" ? "/JL" : "/"Vue项目修改路由配置 base:process.env.VUE_APP_BASE_Title,//----------------------------------...原创 2022-05-05 13:24:59 · 1982 阅读 · 1 评论 -
vue- Form Generator表单代码生成
form-generator原创 2022-04-28 15:02:00 · 1117 阅读 · 0 评论 -
echarts图表使用
官网Apache ECharts下载安装npm install echarts --save简单使用<template> <div class=""> <div id="main" style="width: 600px;height:400px;"></div> </div></template><script> /** * author 大智...原创 2022-04-28 10:39:07 · 357 阅读 · 0 评论 -
vue-项目优化
网络请求添加进度条1.给项目添加进度条效果，先打开项目控制台，打开依赖，安装nprogress2.main.js中添加代码npm install --save nprogress//导入进度条插件import NProgress from 'nprogress'//导入进度条样式（包里自带的）import 'nprogress/nprogress.css'.....//请求在到达服务器之前，先会调用use中的这个回调函数来添加请求头信息axios.intercepto.原创 2022-04-27 17:05:28 · 275 阅读 · 0 评论 -
12.nodejs
1.目录结构2.环境安装1.Node下载地址http://nodejs.cn/download/2.查看node安装的版本node -v3.查看npm安装版本npm -v4.设置npm下载安装包的位置，此目录要在path中配置，设置环境变量可以使得住任意目录下都可以使用cnpm、vue等命令，而不需要输入全路径npm config set prefix "C:\node\node_global"npm config set cache "C:\nod.原创 2022-03-09 18:15:40 · 796 阅读 · 0 评论 -
npm操作
//设置npm下载源npm config set registry https://registry.npm.taobao.org//获得npm下载源npm config get registry//下载cnmpnpm install -g cnpm --registry=https://registry.npm.taobao.org原创 2022-03-09 14:18:23 · 2269 阅读 · 0 评论 -
nrm使用
什么是nrmnrm 是一个 npm 源管理器，允许你快速地在 npm源间切换。什么意思呢，npm默认情况下是使用npm官方源（使用npm config ls命令可以查看），在国内用这个源肯定是不靠谱的，一般我们都会用淘宝npm源：https://registry.npm.taobao.org/，修改源的方式也很简单，在终端输入：npm set registry https://registry.npm.taobao.org/再npm config ls查看，已经切换成功。那么，问.原创 2022-04-25 14:31:52 · 1535 阅读 · 0 评论 -
vue-基础
v-cloak防止页面加载时出现闪烁问题 <!-- Vue 中只有在标签的 内容中 才用插值语法 --> <div v-cloak >{{msg}}</div>v-text1.v-text指令用于将数据填充到标签中，作用于插值表达式类似，但是没有闪动问题2.此处为单向绑定，数据对象上的值改变，插值会发生变化；但是当插值发生变化并不会影响数据对象的值 <p v-text="msg"></p>v-ht.原创 2022-04-26 15:49:17 · 186 阅读 · 0 评论 -
vue-工程项目结构
components文件夹用来存放Vue 组件。个人建议，把每一个组件中使用到的image图片放置到对应的组件子文件目录下，便于统一的管理Node_modules/npm安装的该项目的依赖库vuex/文件夹存放的是和 Vuex store 相关的东西（state对象，actions，mutations)router/文件夹存放的是跟vue-router相关的路由配置项build/文件是 webpack 的打包编译配置文件static/文件夹存放一.原创 2022-04-26 17:23:56 · 9289 阅读 · 1 评论 -
vue-cli2和vue-cli3的区别
vue-cli2和vue-cli3比较1.vue-cli3比vue-cli2少了build、config、static目录，多了public目录创建项目方式2.0的安装：vue init webpack projectname3.0的安装：vue create projectname启动方式2.0是通过:npm run dev启动流程：npm run dev启动过程3.0是：npm run serve启动流程：https://blog.csdn.ne...原创 2022-04-26 17:31:08 · 1777 阅读 · 0 评论 -
vue-router
使用方法###4.Vue Router的使用步骤(★★★)A.导入js文件<script src="lib/vue_2.5.22.js"></script><script src="lib/vue-router_3.0.2.js"></script>B.添加路由链接:<router-link>是路由中提供的标签，默认会被渲染为a标签，to属性默认被渲染为href属性，to属性的值会被渲染为#开头的hash地址<route.原创 2022-04-18 21:34:24 · 242 阅读 · 0 评论 -
vue-vuex
Vuex是实现组件全局状态（数据）管理的一种机制，可以方便的实现组件之间的数据共享引入//main.jsimport Vue from 'vue'import App from './App.vue'import store from './store'Vue.config.productionTip = falsenew Vue({ store, render: h => h(App)}).$mount('#app')//store.jsimpor.原创 2022-04-18 20:24:08 · 559 阅读 · 0 评论 -
Vue3.0 项目打包，启动
1.打包1.使用 vue ui打包（选择任务-选择build-选择运行）2.使用命令打包（vite build），本项目使用vite进行打包2.生成打包文件1.项目中会出现一个dist文件3.新建承载服务器1. 进入D盘，安装express-generator生成器执行 npm install express-generator -g 进行安装2. 创建一个express项目执行 express expressDemo （expres...原创 2022-03-25 11:05:43 · 5617 阅读 · 0 评论 -
vue-ui使用
1.查询是否安装Vue cli1.查询vue版本指令：vue -V返回：@vue/cli 5.0.42.查询不到版本，使用npm命令安装vue脚手架npm install -g @vue/cli2.新建项目文件1.桌面新建一个my_vue项目2.在项目按住Shift，鼠标点击右键3.选择 打开 powershell4.输入 vue ui（初次使用会出现问题）4.1执行：Get-ExecutionPolicy4.2执行Set-ExecutionPolicy...原创 2022-03-25 14:39:58 · 3152 阅读 · 0 评论 -
vue-axiox网络请求
Axios 介绍1.是基于Promise的HTTP客户端，可以在浏览器和Node.js中使用axios安装npm install axios客户端引入import axios from 'axios';服务器端引入const axios = require('axios');Get请求axios.get('http://localhost:3000') .then(res => { console.log..原创 2022-04-23 22:35:00 · 889 阅读 · 0 评论 -
11.Layui后台异步加载select下拉菜单
前端html页面 <label class="layui-form-label">服务器环境</label> <div class="layui-input-inline" style="width:150px;"> <select name="server" id="server"> ...原创 2019-09-05 14:35:43 · 5801 阅读 · 0 评论 -
12.layui分页查询
真分页前端分页展示数据，后端分页获取数据。前台向后台传递俩分页参数，一个curr,一个limitcase.html <div style="width: 95%;height: auto;min-height: 700px;margin-left: 15px" > <table class="layui-hide" id="caseListTable" la...原创 2019-09-05 15:25:32 · 1862 阅读 · 0 评论