《基于Vue.js的Web前端应用研究》文献阅读(十五)

一、基本信息

标题:基于Vue.js的Web前端应用研究

时间:2017

来源:科技与创新

关键词:Web前端;Vue.js;JavaScript组件;Vue框架

二、研究内容

1.主要内容:

随着互联网的迅猛发展,用户对Web前端的使用体验、交互操作流程、外观有了更高的要求。特别是Web系统中越来越多的数据处理和业务逻辑开始偏向前端,导致Web前端工作量扩大,代码量增加。如果
仍然采用传统的方式开发设计Web前端,会导致前期开发度和后期维护难度增大,可扩展性变差。为了提高开发效率和代码复用率,越来越多的网页开发框架开始流行。于是先后提出了MVC、MVVM模式,方便
了构建基于事件的Web前端开发平台。本文主要介绍了基于MVVM模式的轻量级响应式框架Vue js的应用和研究,利用Vue框架实现了简化Web前端开发流程。
1应用需求
我校教师工作处为了更好地服务和管理全校教师借鉴全国教师管理系统,结合我校实际工作需求,开发-套Web教师管 理系统。该系统的主要要求有以下3个:(1)界面友好,美观大方。(2) 系统能实现对教
师的基本信息、教学、科研、学习经历、工作经历、培训、访学、获奖等信息的统计和管理。(3) 系统运行安全、稳定、速度快、便于管理。因为系统处于急用状态,开发、实施时间短,所以,决定采用前、后
端同时开发和调试,利用JSON API的方式,实现Web的前后分离,逻辑处理部分转移到前端来实现,开发人员可以根据用户的需求对前端进行快速迭代更新,具有高度的灵活性和可打展性。
2 Vue.js介绍
为了提高开发效率,对Web前端基于框架进行了开发。对比目前比较流行的React、Angular、 Ploymer框架, 最终选择了Vue js (以下简写为Vue)框架。与其他重量级框架不同的是,Vue是一套构建用户界
面的渐进式框架,采用自底向上增量开发的设计方式,是更加灵活、开放的解决方案,架构更加简单,适合开发人员快速掌握其全部特性并投入使用,还便于与第三方库或既有项目整合。结合Vue生态系统支持库
Vuex、Vue-router, 能够为复杂的应用程序提供驱动。

四、参考文献

[1]基于Vue.js的Web前端应用研究[J]. 朱二华.  科技与创新. 2017(20)

原文地址:https://www.cnblogs.com/yuandabo/p/11964918.html

时间: 2024-10-30 13:26:53

《基于Vue.js的Web前端应用研究》文献阅读(十五)的相关文章

基于VUE.JS的移动端框架Mint UI

Mint UI GitHub:github.com/ElemeFE/mint 项目主页:mint-ui.github.io/# Demo:elemefe.github.io/mint- 文档:mint-ui.github.io/docs/# 由饿了么前端团队推出的 Mint UI 是一个基于 Vue.js 的移动端组件库.自 6 月初开源以来,根据社区和团队内部的反馈,修复了一些 bug 并新增了部分组件,于本周发布了 0.2.0 版本.本文介绍如何从零开始构建一个使用 Mint UI 的 Vu

基于Vue.js 2.x系列的后台管理系统解决方案

基于Vue.js 2.x系列 + Element UI 的后台管理系统解决方案. github地址:https://github.com/lin-xin/manage-systemdemo地址:http://work.fengdb.com功能包括:Element UI登录/注销表格表单图表富文本编辑器markdown编辑器图片拖拽/裁剪上传支持切换主题色

基于Node.js的web聊天系统 - 真正意义上的web实时聊天系统

简单介绍一下这个实时web聊天系统的功能,首先进入系统的人填入名字和邮件地址后会获取到一个由系统创建的URL地址,你可以把这个地址发给另外一个人,另外一个人进入系统后就可以和你进行实时的聊天对话咯.主要用到了Node.js和socket.io 两个库,另外还用到了的库有express,  gravatar, ejs, 具体细节查看package.json,需要的这些库如果本地没有的话运行会报错的,需要使用npm install 安装.大家可以下载demo源代码进行运行测试. 源代码下载后解压有如

基于vue.js的简单用户管理

功能描述:添加.修改.搜索过滤 效果图: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <title>简单用户管理</title> 5 <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"

基于vue.js的图片预览组件2.0.1

基于vue.js的图片预览组件 Github github 安装 npm install enlargeimg --save-dev import enlargeimg from 'enlargeimg'; 基础用法 <enlargeImg :data="files"></enlargeImg> export default { name: 'hello', data () { return { msg: 'Welcome to Your Vue.js App'

Web前端开发测试题阅读笔记

引自: http://www.w3cplus.com/css/front-end-web-development-quiz.html Q7:下面代码弹出值是什么? x = 1; function bar() { this.x = 2; return x; } var foo = new bar(); alert(foo.x); 答:2 这里主要问题是最外面x的定义,试试把x=1改成x={},结果会不同的.这是为什么呢?在把函数当作构造器使用的时候,如果手动返回了一个值,要看这个值是否简单类型,如

一次基于Vue.Js的用户体验优化

.mytitle { background: #2B6695; color: white; font-family: "微软雅黑", "宋体", "黑体", Arial; font-size: 18px; font-weight: bold; height: 25px; line-height: 25px; margin: 15px 0 !important; padding: 5px 0 5px 20px; width: 97% } .arti

基于 Vue.js 的移动端组件库mint-ui实现无限滚动加载更多

通过多次爬坑,发现了这些监听滚动来加载更多的组件的共同点, 因为这些加载更多的方法是绑定在需要加载更多的内容的元素上的, 所以是进入页面则直接触发一次,当监听到滚动事件之后,继续加载更多, 所以对于无限滚动加载不需要写首次载入列表的函数, 代码如下: html: //父组件 <div v-infinite-scroll="loadMore" infinite-scroll-disabled="loading" infinite-scroll-distance=

Web前端开发推荐阅读书籍、学习课程下载

转自http://www.xuanfengge.com/fe-books.html 前言 学校里没有前端的课程,那如何学习JavaScript,又如何使自己成为一个合格的前端工程师呢? 除了在项目中学习和跟着有经验的同事学习,读书也是必不可少的.书中有着相对完整的知识体系,每读一本好书都会带来一次全面的提高. 而如果深一脚浅一脚的学习,写出代码的质量会参差不齐.初学者的首要任务是成为靠谱的熟练开发者,能够稳定的输出有一定质量的代码. 前端技术发展速度特别快,总是涌现出很多新的东西,需要不断的学习