第二章、 Vue 起步
2-2.编写hello world

首先创建vue实例,然后实例接收一些配置项,el表示实例负责管理的区域,data表示区域内的数据

两秒后内容变为bye world 其中app表示实例对象,$data表示实例对象所管辖的区域的数据。
2-3 TodoList

v-for循环指令,可以帮助我们循环数据,list指data里面的list数据,item指循环过程中每一项的内容。
可在console中可调试,可改值。数据双向绑定调试

2-4MVVM
传统的开发模式MVP设计模式,代码分为三层,Model==>数据层(一般是用ajax获取的远程数据) View=>视图层(指html结构) Presenter==》控制层(业务逻辑相关的==》操作dom或者用ajax去获取数据)

视图层(View)发出事件交给控制器(Presenter),控制器要么去获取(ajax)数据(Model)要么去操作dom(view)
MVP开发模式代码如下:


MVVM模式

实例中操作的是Model
主要操作是Model,操作的是数据层及视图层。大大减少dom的操作。
2-7、简单的组件中的传值



父组件通过属性传值,子组件通过事件传值。
第二章、 Vue 起步的更多相关文章
- 第二章 Vue快速入门--14 使用v-model实现计算器的案例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门--13 讲解v-model实现表单元素的数据双向绑定
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门--12 事件修饰符的介绍
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门--10-11 跑马灯效果制作
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门--9 使用v-on指令定义Vue中的事件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门--8 v-bind指令的学习
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门--7 讲解v-cloak、v-text、v-html的基本使用
7 讲解v-cloak.v-text.v-html的基本使用 <!DOCTYPE html> <html lang="en"> <head> & ...
- 第二章 Vue快速入门-- 28 自定义按键修饰符
事件处理-按键修饰符 js 里面的键盘事件对应的键码 <!DOCTYPE html> <html lang="en"> <head> <m ...
- 第二章 Vue快速入门-- 27 字符串的padStart方法使用
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
- 第二章 Vue快速入门-- 26 过滤器-定义私有过滤器
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...
随机推荐
- python中使用自定义类实例作为字典的key
python中dict类型的key值要求是不可变类型,通常来说,我们一般采用int或者str类型来作为字典的key,但是在某些场景中,会造成一定的麻烦. 如我们有一个处理http Request的规则 ...
- fiddler修改请求表单数据
一.使用出发点:进行测试某个添加编辑功能时候,部分字段前端限制了字段长度或者SQ,特殊字符等等的输入: 但是我们测试验证后端服务器是否处理,这个时候去修改提交请求表单,绕过前端的限制进行测试: 二.使 ...
- UMLet的使用与类图的设计
本实验是为后续实验做准备的.在本书中,各个程序实例都要画类图,所以读者必须掌握用某种UML建模工具来画类图,本书选择 UMLet 作为 UML 的建模工具.实验目的本实验的主要目的如下. 理解类的基本 ...
- Java中的注意点
1.源文件以.java结束,源文件的基本组成部分是类(class) 2.每个源文件只能有一个public类,源文件名必须和该类的类名一致 3.每个Java程序的执行入口都是main()方法,固定写法为 ...
- java中字符串相等判断
字符串的判断有2种: 1.判断地址是否相等 用:== 2.判断值是否相等 用:equals方法 Object类作为所有类的超类,而Object类的equals方法是直接比较地址的,源码如下: pu ...
- 年轻的心与渐行渐近的梦——记微软-斯坦福产品设计创新课程ME310
作者:中国科学技术大学 王牧 Stanford D. School 2014年6月,沐浴着加州的阳光,在斯坦福大学(下文简称Stanford)完成汇报后,历时一年的创新设计课程ME310的项目结束 ...
- RPC 框架性能大比拼
Dubbo 是阿里巴巴公司开源的一个Java高性能优秀的服务框架,使得应用可通过高性能的 RPC 实现服务的输出和输入功能,可以和 Spring框架无缝集成. Motan 是新浪微博开源的一个Java ...
- mode|平均数|方差|标准差|变异系数|四分位数|几何平均数|异众比率|偏态|峰态
应用统计学 数据的概括性度量 集中趋势 Mode众数是唯一描述无序类别数据,由图可知众数便是图形中的峰. 对于类别变量,众数就是某一种类别. 中位数和平均数都可能不是样本中的值. 中位数不受极值影响, ...
- python 组件
组件:JQueryUI.EasyUI.BootStrap 每一个框架都要学习它们的规则.
- Widgets学习
ListView ListView RecyclerView RecyclerView ExpandableListView 关闭箭头 elvMsg.setGroupIndicator(null); ...