![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
VUE
文章平均质量分 74
华科易迅
这个作者很懒,什么都没留下…
展开
-
VUE Webpack搭建前端项目框架
当前使用前后端分离框架实施的项目越来越多,前后端分离技术实施项目可以是项目成员分工愈发明确,开发效率更高,由于后台微服务框架普及与高效,前后端分离技术将成为主流软件框架。本文使用VUE+Webpack搭建前端项目,UI框架选用ElementUI技术,当然也可以选用其他成熟的UI框架。安装NodeJS从中文NodeJS站点下载http://nodejs.cn/download/或者从云盘下载...原创 2020-02-17 16:24:54 · 738 阅读 · 0 评论 -
ElementUI 添加查询删除及三级地址联动例程
1、使用Vue Cli创建VUE项目vue create myvue2、添加vue-router,element-ui,axios类库npm install vue-routernpm install element-uinpm install axios3、添加list.vue列表页面<template><div> <el-form :inli...原创 2019-08-16 14:44:14 · 688 阅读 · 0 评论 -
ElementUI图片上传
本例采用图片数据存储到数据库字段的方式上传文件实体类package com.test.model;import java.io.Serializable;import java.sql.Blob;import java.sql.Date;import javax.sql.rowset.serial.SerialBlob;public class FileInfo impleme...原创 2019-08-20 22:24:32 · 811 阅读 · 0 评论 -
ElementUI实现异步加载树
路由文件修改import List from '@/components/list.vue'import Add from '@/components/add.vue'import Tree from '@/components/tree.vue'import AsynTree from '@/components/asyntree.vue'export default{ ro...原创 2019-08-20 14:21:44 · 4476 阅读 · 9 评论 -
ElementUI例程
1、使用Vue Cli创建VUE项目vue create myvue2、添加vue-router,element-ui,axios类库npm install vue-routernpm install element-uinpm install axios3、新建列表文件组件List.vue<template><div class="cantainer">...原创 2019-08-15 09:50:33 · 306 阅读 · 0 评论 -
VUE+JSP实现三级联动例程
JSP页面<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.d...原创 2019-08-10 11:24:49 · 957 阅读 · 0 评论 -
VUE集成EasyUI
EasyUI是非常成熟前端框架,它对VUE支持也非常完善,参考其中文官网也非常容易入手http://www.jeasyui.cn与官网http://www.jeasyui.com,参照如下步骤开始使用EasyUI-VUE1、使用Eclipse的CodeMix插件创建VUE工程2、使用NPM安装vx-easyui程序包在项目所在目录运行npm install vx-easyui --sa...原创 2019-06-02 20:44:24 · 14039 阅读 · 0 评论 -
VUE集成ElementUI开发
Element,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库,与VUE无缝集成,并且前端界面展示丰富,学习成本最小,应用广泛,Element不同于Bootstrap,Easyui,自Element产生之初即基于Vue,所以它具有得天独厚条件,与VUE兼容性最好,所以推荐使用Element作为前端开发工具按照如下步骤,指导开发者快速建立Element+VUE开发环境和示...原创 2019-06-02 14:24:39 · 18608 阅读 · 0 评论 -
VUE 条件指令语法
v-if v-else v-else-if<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Hello Vue</title><script src="https://cdn.jsdelivr.net/npm/vue/di原创 2019-01-14 12:34:09 · 576 阅读 · 0 评论 -
VUE ajax数据装载与提交
VUE可以集成很多Ajax类库与后台交互数据,本文使用VUE集成Axios Ajax类库Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中。Features从浏览器中创建 XMLHttpRequests从 node.js 创建 http 请求支持 Promise API拦截请求和响应转换请求数据和响应数据取消请求自动转换 JSON 数据...原创 2019-01-14 10:45:55 · 575 阅读 · 0 评论 -
VUE生命周期函数
每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如,需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数,这给了用户在不同阶段添加自己的代码的机会。从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程,参考官网图片<!DOCTYPE html><html&...原创 2019-01-14 08:22:04 · 173 阅读 · 0 评论 -
VUE 样式绑定
操作元素的 class 列表和内联样式是数据绑定的一个常见需求。因为它们都是属性,所以我们可以用 v-bind 处理它们:只需要通过表达式计算出字符串结果即可。不过,字符串拼接麻烦且易错。因此,在将 v-bind 用于 class 和 style 时,Vue.js 做了专门的增强。表达式结果的类型除了字符串之外,还可以是对象或数组。绑定 HTML Class<!DOCTYPE html&...原创 2019-01-13 20:58:33 · 348 阅读 · 0 评论 -
VUE模板语法
Vue.js 使用了基于 HTML 的模板语法,允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML ,所以能被遵循规范的浏览器和 HTML 解析器解析。在底层的实现上,Vue 将模板编译成虚拟 DOM 渲染函数。结合响应系统,Vue 能够智能地计算出最少需要重新渲染多少组件,并把 DOM 操作次数减到最少。如果你熟悉虚拟 DOM 并且偏...原创 2019-01-13 20:27:34 · 426 阅读 · 0 评论 -
VUE数据与方法
VUE实现前端页面数据与控件的双向绑定,VUE实例中必须定义数据,以及操作数据的方法。Vue实现使用new Vue函数创建,当一个 Vue 实例被创建时,它向 Vue 的响应式系统中加入了其 data 对象中能找到的所有的属性。当这些属性的值发生改变时,视图将会产生“响应”,即匹配更新为新的值。<!DOCTYPE html><html><head>&l...原创 2019-01-13 20:13:00 · 2634 阅读 · 0 评论 -
VUE入门案例
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。VUE在前端页面实现双向数据绑定,即DOM控件与Javascript数据对...原创 2019-01-13 19:24:25 · 427 阅读 · 1 评论 -
VUE组件
定义VUE组件 Vue.component('order-item', { //定义VUE组件的属性名称 props: ['items','prdtlist'], template: '&lt;table&gt;'+ '&lt;tr&gt;'+ ' &lt;td colspan="10"&gt;'+ ' 订单明细'+原创 2019-01-17 12:13:56 · 245 阅读 · 0 评论 -
Vue DevTool谷歌浏览器中安装使用
一、从Git上下载Devtoolhttps://github.com/vuejs/vue-devtools打开命令行程序执行,当前目录转移到d:/vuegit clone https://github.com/vuejs/vue-devtools.git二、使用npm安装devtoolMake sure you are using Node 6+ and NPM 3+Clone t...原创 2018-12-22 22:27:11 · 328 阅读 · 0 评论 -
SpringBoot + VUE实现订单案例
Vue是一个前端的双向绑定类的框架,使用它完成前端页面逻辑非常方便,按照其约定可以高效完成前端复杂业务逻辑,用户不必再关心数据正确回显问题,只要数据格式是正确的,配置双向绑定规则是正确的,系统就能正确显示页面。尤其在单网页应用中,用法最为方便。如下介绍如何快速使用VUE设计案例。什么是双向绑定Vue框架很核心的功能就是双向的数据绑定。 双向是指:HTML标签数据 绑定到 Vue对象,另外反方向...原创 2018-12-22 17:47:39 · 6206 阅读 · 2 评论