基于：jdk1.8、spring boot2.1.3、vue-cli3.4.1特性： ~ 数据库访问使用spring data jpa+alibaba druid ~ 前后端数据交互使用axios ~ 前后端交互数据验证使用validation ~ 前端使用vue+element ~ 前端使用了npm管理包 ~ 用户鉴权使用spring security+jwt的无状态认证方式 ~ 用户鉴权前端路由做了拦截使用： ~ 后端配置文件在boot/src/main/resources/config/ ~ 前端配置文件在ui/.env.development、ui/...
elementUI官网:http://element.eleme.io/使用步骤：1、安装完vue-cli后，再安装 element-ui命令行：npm i element-ui -D相当于 npm install element-ui --save-dev// i -> install D -> --save-dev S -> --save 都是缩写2、在main.js入口文件中引入它的js和cssimport ElementUI from ‘element-ui‘ //固定路径，类似vuerouterimport ‘element-ui/lib/theme-default/index.css‘ //固定路径注意：...
文章会讲到如何在Vue框架中引入Element那我们先来说一下Vue框架：Vue是渐进式，JavaScript框架。很多人不理解什么是渐进式，简单点讲就是易用、灵活、高效（没有太多限制）这里介绍npm安装方式：打开cmd，找到你Vue项目的路径运行npm i element-ui -S然后在main.js里写入以下内容：import Vue from ‘vue‘;
import ElementUI from ‘element-ui‘;
import ‘element-ui/lib/theme-chalk/index.css‘;
import App from ‘./App.vue...
在初步学习了vue之后，我们可以使用vue的基础知识来实现一个todolist列表，主要功能是通过一个输入框来输入，然后将输入的内容同步的显示在页面上，当点击其中的一项时，出现一条下划线。首先列出在实现功能的过程中需要使用的一些vue语法。1.因为要实现双向绑定，所以需要使用v-model。2.涉及到循环渲染列表，需要使用v-for。3.要实现点击事件，所以在列表上要通过v-on绑定点击事件。4.点击时要在列表上添加或者会删除类名，从而控...
前端页面中使用MVVM的思想，即MVVM是整个视图层view的概念，属于视图层的概念。 MVVM是前端视图层的分层开发思想，将页面分成了Model, View,和VM；其中VM是核心，因为VM是V和M之间的调度者;优势：MVVM提供了数据的双向绑定，让我们的开发更加方便 【注意】这里的MVVM概念与后端服务器的MVC思想毫无关系 原文：https://www.cnblogs.com/yanl55555/p/11744193.html
Vue指令1、v-once指令 单独使用，限制的标签内容一旦赋值，便不可被动更改（如果是输入框，可以主动修改）<!DOCTYPE html>
<html lang="zh">
<head><meta charset="UTF-8"><title></title>
</head>
<body><div id="app"><input type="text" v-model="msg"><input type="text" v-model="msg"v-once> #因为是输入框，一旦赋值，只可主动更改<p>{{msg}}</p><p v-once>{{msg}}</p> #一旦赋值，便不可更改</div>
</body>
<script sr...
1、下载安装包，具体版本根据自己需要。wget https://nodejs.org/download/release/v6.12.3/node-v6.12.3-linux-x64.tar.gz2、解压到指定目录tar -xzvf node-v6.12.3-linux-x64.tar.gz.2 -C ~/app3、配置环境变量#nodejs
export NODEJS_HOME=/home/hadoop/app/node-v6.12.3-linux-x64
export PATH=$NODEJS_HOME/bin:$PATH4、刷新source /etc/profile5、检测node -v此时node.js已经完成。下面是打包有关安装6、安装webpackagenpm in...
最近在学习react和vue，两者其实有很多地方相似。首先都是使用虚拟DOM来实现页面的局部状态的刷新。 ## 图片读取- react的是用./src 来找图片路径- vue是把文件放在static文件夹里 ## 渲染页面 1、字符串模版 ${} 2、react ：{} 3、vue :{{}} ## modules分包 - store里面的文件都是js文件 一级index modules文件是二级 ##Vuedatacreatedmethodscpmupted ##Vuexstatemutationsactionsgettermodules原文：https://www.cnblogs.com/op...
Vue 框架-10-搭建脚手架 CLI + 批处理快捷启动脚手架是通过 webpack 搭建的开发环境使用 ES6 语法打包和压缩 JS 为一个文件项目文件在环境中，而不是浏览器实现页面自动刷新环境准备1.安装 node.js
官网：https://nodejs.org/zh-cn/2.打开终端或者 cmd 使用下面两个命令进行测试：要求：node 版本 >6.9.0node -v要求：npm 版本 >=3.10.0npm -v安装 Vue CLIVue CLI 官方文档：https://cli.vuejs.org/guide/1.全局安装 vue-cli，使用...
零、介绍Vue 基础知识 (指令 + todomvc )Vue 全家桶 ( vue /vue-router / vuex + axios )组件化开发 ： 最近比较流行的一种开发模式 ， 之前是原生 =>模块化 => 组件化把一个完整的项目划分成一个小小的组件4.webpack - 前端模块化打包构建工具2019.5.15一、Vue 介绍vue 中文网github 下载地址Vue.js (读音 /vju：/ view)渐进式 JavaScript 框架
3.1 渐进式 ：小型项目 就可以使用 vue 就高度了
随着页面的复杂程序提高，就要学习 ...
直接上代码<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title>
</head>
<body><div id="app"><div><input type="text" v-model="uname"><button @click.stop.prevent="add">添加</button></div><ul><li v-for="(item, index) in list" :key="item.id"><input type="checkbox">{{item.id}}---{{item.name}}</li></ul></div><script src="http://ybf-shopnew.oss-cn-beijing.aliyuncs.com/web_vend...
项目初始化vue-element-admin 源码git clone https://github.com/PanJiaChen/vue-element-admin
cd vue-element-admin
npm i
npm run dev
若npm 报错 Cannot find module ‘core-js/modules/es6.regexp.constructor‘，可安装cnpm install core-js@2识别es6语法精简化项目删除 src/views 下的源码，保留：
dashboard：首页error-page：异常页面login：登录redirect：重定向对 src/router/index 进行相应修改import Vue from ‘vue‘...
1、使用Vue CLI工具生成脚手架，这是最常见的使用方式，简单用模板生成一个HelloWorld Demo，可以学习Vue的SPA项目结构2、通过script引入Vue.js，详细如下：这里搭配Mint-ui<!DOCTYPE html><html><head><meta charset="UTF-8"><!-- 引入样式 --><link rel="stylesheet" href="https://unpkg.com/mint-ui/lib/style.css"></head><body><div id="app"><mt-button @click.native="handleClick">按钮</mt-button></div></body><!-- 先引...
一个构建用户界面的框架通过指令，来给DOM元素赋值或者其他操作。简单的指令及其作用：在HTML标签中显示数据： --> {{}} --> v-text --> v-html 这三条指令都是给HTML具体标签填充内容，可以是文本，也可以是其他标签 ------------------- --> v-if --> v-else 这两条命令配合使用，如果变量为true，则插入if所在的标签，否则就插入else所在的标签。 ------------------- --> v-show 如果变量为t...
首先，第一步，新建个项目文件夹shift+鼠标右键选择打开命令窗口npm install -g vue-cli
然后安装好了之后新建个项目的目录 vue init webpack testProject name 这里可以输项目名称
Project description 这里可以输项目的描述
然后就一直回车
Install vue-router 这里问要不要安装路由
Use ESLint to lint your code 然后这里问要不要装ESList检测
然后就一直回车到最后ok了。然后接下来去安装一下依赖 ，你可以退出手动进去刚...