Vuejs简介
一、网站交互方式
①传统的开发方式:PHP 中,页面和服务端糅合在一起,在这种项目中服务端占比更重,因为绝大多数都服务端技术,绝大多数网站都是这样的方式
②前后端分离方式:服务端只处理数据(不关心页面),提供接口,分离多页(处理页面,通过接口和服务端交互)
③当前主流方式是前后端分离方式,传统的混合开发方式页面和数据糅杂在一起很难维,所以慢慢的把服务端处理视图的业务转变到了前端
二、JavaScript主流前端框架
①Angular:诞生于2009年,后为Google所收购。是一款优秀的前端JS框架。AngularJS有着诸多特性,最为核心的是:MVW(Model-View-Whatever)、模块化、自动化双向数据绑定、语义化标签、依赖注入等等
②React:React 起源于 Facebook 的内部项目。React主要用于构建UI。在React里传递多种类型的参数,如声明代码,帮助你渲染出UI、也可以是静态的HTML DOM元素、也可以传递动态变量、甚至是可交互的应用组件。
③Vue: 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
三、Vuejs介绍
①是一个前端JavaScript框架,可以提高网站应用程序开发效率,可以开发单页应用程序,可以融入到不同项目中。
②发展历史:0.6版本(2013.6)-----1.0版本(2015.10)-----2.0版本(2016.10)----2.5版本(至今),参考https://github.com/vuejs/vue/releases
④兼容性:Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的浏览器。
四、安装
①直接下载并用 <script> 标签引入,Vue 会被注册为一个全局变量
②CDN:
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
③npm:
$ npm install vue
五、示例:输出 hello world
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>vue</title>
</head>
<body>
<div id="app">
<h1>{{ message }}</h1>
</div>
<script src="node_modules/vue/dist/vue.js"></script>
<script>
var app = new Vue({
el: '#app',
data: {
message: 'Hello world!'
}
})
</script>
</body>
</html>

Vuejs简介的更多相关文章
- vuejs点滴
博客0.没事的时候可以看的一些博客:https://segmentfault.com/a/1190000005832164 http://www.tuicool.com/articles/vQBbii ...
- 02: vue.js常用指令
目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...
- MVVM前端框架
早开始接触MVVM框架的时候,是在学习WPF的时候,后面陆陆续续接触到了很多的前端JS框架,个人觉得大同小异,也没有去研究源代码,所以都停留在使用的阶段.当然对于我来说,使用这些JS框架,最关注的无非 ...
- vuejs课程简介及框架简介
vuejs准备知识: 1.前端开发基础 html css js 2.前端模块化基础 3.对es6有初步的了解 vuejs是一种轻量级的MVM框架,他吸收了react和angular的优点,强调re ...
- VueJs大全;vee-validate(一个验证vue插件), bootstrap-vue, axios简介。
Vue.js大全(包括依赖,插件,好的指导文章等!)
- Vue.js简介
Vue.js简介 Vue.js的作者为Evan You(尤雨溪),任职于Google Creative Lab,虽然是Vue是一个个人项目,但在发展前景上个人认为绝不输于Google的AngularJ ...
- Vue.js的简介
vue.js简介 Vue.js读音 /vjuː/, 类似于 view Vue.js是前端三大新框架:Angular.js.React.js.Vue.js之一,Vue.js目前的使用和关注程度在三大 ...
- 03: vuejs 事件、模板、过滤器
目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 03: vuejs 事件.模板.过滤器 目录: 1.1 事件 1.2 模板 1.3 自定义过滤器 1.4 过度 1.5 支付 ...
- Weex 简介
weex简介 Weex 是一套简单易用的跨平台开发方案,能以 web 的开发体验构建高性能.可扩展的 native 应用,为了做到这些,Weex 与 Vue 合作,使用 Vue 作为上层框架,并遵循 ...
随机推荐
- python利用dijkstra算法求解图中最短距离
利用dijkstra算法,来完成图中两个顶点间最短的距离,可以直接复制使用,只需要修改参数即可 def dijkstra_raw(edges, from_node, to_node): "& ...
- LOJ2874 JOISC2014 历史研究 分块、莫队
传送门 看到出现次数自然地考虑莫队. 但是发现如果需要删除并动态维护答案的话,则要用一个堆来维护答案,增加了一个\(log\).但是加入操作却没有这个\(log\),所以我们考虑避免删除操作. 分块, ...
- GoF的23种设计模式之结构型模式的特点和分类
结构型模式描述如何将类或对象按某种布局组成更大的结构.它分为类结构型模式和对象结构型模式,前者采用继承机制来组织接口和类,后者釆用组合或聚合来组合对象. 由于组合关系或聚合关系比继承关系耦合度低,满足 ...
- - Gradle 翻译 Analyzer APK文件分析 MD
目录 目录 APK文件分析 使用 APK 分析器分析您的编译版本 查看文件和大小信息 查看 AndroidManifest.xml 查看 DEX 文件 过滤DEX文件树视图 加载 Proguard 映 ...
- linux学习 - 基本命令篇
关机重启命令 基本操作之修改用户名(Ubuntu) 查看系统版本号 查看系统是32位还是64位 系统进程信息查看 查看某个端口被占用的情况 查看磁盘分区使用情况 df 命令 fdisk 关机重启命令 ...
- Maven中 jar包冲突原理与解决办法
Maven中jar包冲突是开发过程中比较常见而又令人头疼的问题,我们需要知道 jar包冲突的原理,才能更好的去解决jar包冲突的问题.本文将从jar包冲突的原理和解决两个方面阐述Maven中jar包冲 ...
- SqlServer共用表达式(CTE)With As 处理递归查询
共用表表达式(CTE)可以看成是一个临时的结果集,可以再SELECT,INSERT,UPDATE,DELETE,MARGE语句中多次引用. 一好处:使用共用表表达式可以让语句更加清晰简练. 1.可以定 ...
- vue跳转链接(新页签)
const {href} = this.$router.resolve({path:"/hosScreen"}); window.open(href, '_blank');
- 22、vue实现随机四位数验证码
效果图: 1.新建生成验证码的组件Sidentify.vue(代码如下): <template> <div class="s-canvas"> <ca ...
- 14、vue-cli脚手架搭建项目
1:全局安装vue-cli:npm install --global vue-cli2:进入你的项目目录:cd myProject3:初始化创建项目:vue init webpack vue-demo ...