《前端福音,vue.js 之豆瓣电影组件大揭秘-video》
{{ message }} 小胡子语法 在 Vue 中被称之为双花括号插值表达式
---------------- http://todomvc.com/
TodoMVC是一款开源的JavaScript框架,它使用各种不同的MV*框架实现一个相同的Todo应用。TodoMVC最大的优点就是帮助开发者挑选出合适的MV*框架,从Backbone, Ember, AngularJS, Spine...一系列框架中决定使用哪个框架。
开发者现在有很多的MV*框架选择来组织开发web应用程序。Backbone、 Ember、AngularJS、Spine… 新的稳定解决方案列表持续增长,但你如何决定在海量的框架中选择哪个使用?为了帮助解决问题,于是诞生了TodoMVC项目,它使用不同的最流行的JavaScript MV*框架实现了一个相同的Todo应用。
# VueJS 入门实践 ![vue-logo](img/logo.png) ## 课程介绍 VueJS是一个非常简单但十分强大的库,用于构建数据驱动的组件,为构建现代化的 Web 界面而生。
它具有简单易用、小巧灵活、性能高效等特性,可以更轻松的完成复杂应用页面需求,
但是不同于 AngularJS 和 React 等前端框架,通过 VueJS 构建的应用程序结构更为清晰更为简洁。 通过本次课程的学习,我们可以对 VueJS 有一个基本的认识,并可以通过完成一个番茄清单应用对 VueJS 快速入门。 ![TodoMVC](img/todo.png) ## 课程知识点 - MVVM
- 模板语法
- 常用指令
- 番茄清单:TodoMVC
- 使用 Vue 获取网络资源
- 课后作业:豆瓣电影 ## 简介 > 渐进式 JavaScript 框架 - [Vue - 中文官网](https://cn.vuejs.org/)
- [Vue - 官网](https://vuejs.org/)
- [Vue - Github](https://github.com/vuejs/vue)
- [Vue - Awesome](https://github.com/vuejs/awesome-vue)
- Vue.js(读音 /vjuː/, 类似于 view) 是一套构建用户界面的 渐进式框架
+ 只关注视图
+ 渐进式,可以很轻松的和其它已有库或已有项目整合到一起,增量式开发
- 简单易用
+ 只需要基本的 HTML、CSS、JavaScript 基础即可
- 轻量高效
+ 压缩后大小仅仅 17kb
- MVVM
- 组件化 ## 起步 ### 我该如何学习一个新技能 - what
+ 是什么
+ JavaScript 框架
+ 上官网 -> 起步(Getting Started)
+ Vue 作者:尤雨溪
+ 单页应用:SPA
* Angular
* ReactJS
* 。。。
* VueJS
- why
- how ### SPA(Single Page Application):单页应用 以前网站的交互模型都是通过服务器直出的形式直接渲染到客户端。 - 客户端发起一个请求
- 浏览器锁死:等待服务端的响应
- 渲染服务端响应的数据内容 ### 安装 > 参考文档:https://cn.vuejs.org/v2/guide/installation.html - 单文件
- CDN
- NPM
- Bower ### hello world ```html
<div id="app">
{{ message }}
</div>
``` ```js
new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
``` ## Vue 基础 ### 表达式 ### 常用指令 - v-text
- v-html
- v-show
- v-if
- v-else
- v-else-if
- v-for
- v-on
+ https://cn.vuejs.org/v2/api/#v-on
+ 缩写:`@`
- v-bind
+ https://cn.vuejs.org/v2/api/#v-bind
+ 缩写:`:`
- v-model
+ https://cn.vuejs.org/v2/api/#v-model
《前端福音,vue.js 之豆瓣电影组件大揭秘-video》的更多相关文章
- 简单物联网:外网访问内网路由器下树莓派Flask服务器
最近做一个小东西,大概过程就是想在教室,宿舍控制实验室的一些设备. 已经在树莓上搭了一个轻量的flask服务器,在实验室的路由器下,任何设备都是可以访问的:但是有一些限制条件,比如我想在宿舍控制我种花 ...
- 利用ssh反向代理以及autossh实现从外网连接内网服务器
前言 最近遇到这样一个问题,我在实验室架设了一台服务器,给师弟或者小伙伴练习Linux用,然后平时在实验室这边直接连接是没有问题的,都是内网嘛.但是回到宿舍问题出来了,使用校园网的童鞋还是能连接上,使 ...
- 外网访问内网Docker容器
外网访问内网Docker容器 本地安装了Docker容器,只能在局域网内访问,怎样从外网也能访问本地Docker容器? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Docker容器 ...
- 外网访问内网SpringBoot
外网访问内网SpringBoot 本地安装了SpringBoot,只能在局域网内访问,怎样从外网也能访问本地SpringBoot? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装Java 1 ...
- 外网访问内网Elasticsearch WEB
外网访问内网Elasticsearch WEB 本地安装了Elasticsearch,只能在局域网内访问其WEB,怎样从外网也能访问本地Elasticsearch? 本文将介绍具体的实现步骤. 1. ...
- 怎样从外网访问内网Rails
外网访问内网Rails 本地安装了Rails,只能在局域网内访问,怎样从外网也能访问本地Rails? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Rails 默认安装的Rails端口 ...
- 怎样从外网访问内网Memcached数据库
外网访问内网Memcached数据库 本地安装了Memcached数据库,只能在局域网内访问,怎样从外网也能访问本地Memcached数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装 ...
- 怎样从外网访问内网CouchDB数据库
外网访问内网CouchDB数据库 本地安装了CouchDB数据库,只能在局域网内访问,怎样从外网也能访问本地CouchDB数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动Cou ...
- 怎样从外网访问内网DB2数据库
外网访问内网DB2数据库 本地安装了DB2数据库,只能在局域网内访问,怎样从外网也能访问本地DB2数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动DB2数据库 默认安装的DB2 ...
- 怎样从外网访问内网OpenLDAP数据库
外网访问内网OpenLDAP数据库 本地安装了OpenLDAP数据库,只能在局域网内访问,怎样从外网也能访问本地OpenLDAP数据库? 本文将介绍具体的实现步骤. 1. 准备工作 1.1 安装并启动 ...
随机推荐
- io系列之其他类
一.File类:将文件或者文件夹封装成对象. 方便对文件和文件夹的属性信息进行操作. File对象可以作为参数传递给流的构造函数. 注意: 文件夹名称也可带有扩展名. 构造函数: File(Strin ...
- 转:值得收藏!那些鲜为人知的 Mac OS X 技巧
看到一篇网友整理的比较好的“那些鲜为人知的 Mac OS X 技巧”,转载过来分享给大家!希望能有帮助. 更多专题,可关注小编[磨人的小妖精],查看我的文章,也可上[风云社区 SCOEE],查找和下载 ...
- 剑指Offer_编程题_3
题目描述 输入一个链表,从尾到头打印链表每个节点的值. /** * struct ListNode { * int val; * struct ListNode *next; * ListNode(i ...
- java io系列26之 RandomAccessFile
本文主要介绍 RandomAccessFile. 转载请注明出处:http://www.cnblogs.com/skywang12345/p/io_26.html 更多内容请参考:java io系列0 ...
- HDFS 开发中的文件配置优先级
一.先看集群上的配置,这里设置了文件块副本数为 3 上传一个文件试试 public class ConfigPriority { private Configuration conf; private ...
- javascript中click和onclick的区别
<script type="text/javascript"> $(function(){ $("#btn4").click(function(){ ...
- Linux 内核里的数据结构:红黑树(rb-tree)
转自:https://www.cnblogs.com/slgkaifa/p/6780299.html 作为一种数据结构.红黑树可谓不算朴素.由于各种宣传让它过于神奇,网上搜罗了一大堆的关于红黑树的文章 ...
- HDU 6400(括号组合 ~)
题意是说在 h 行 w 列的矩阵中,通过设计使得尽可能多的行或列能满足题中的平衡条件. 如果行数(列数)是奇数,那么每一列(行)一定不能平衡,就要按照满足每一行(列)平衡,输出“ () “:若行数和列 ...
- Git与GitHub学习笔记(六)使用 Github Pages 管理项目文档
前言 你可能比较熟悉如何用 Github Pages 来分享你的工作,又或许你看过一堂教你建立你的第一个 Github Pages 网站的教程.近期 Github Pages 的改进使得从不同的数据源 ...
- 利用C#访问注册表获取软件的安装路径
文章地址:https://blog.csdn.net/yl2isoft/article/details/17332139