第二章、 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 ...
随机推荐
- 解决2013Lost connection to MySQL server during query错误方法
在my.ini配置文件 mysqld 节点下添加 max_allowed_packet = 500M 也就是配置MySQL允许的最大数据包大小,上面的500M你可以根据你的项目修改为你自己的值,只要比 ...
- 学习python-20191108(1)Mysql、Flask
一.使用pymysql模块操作MYSQL 导入pymysql模块: pip install pymysql 1.增删改 import pymysql # 定义数据库连接信息 config = { ...
- VB.Net制作-历朝通俗演义
原先的回数,全是汉语数字,为此我先转换成了阿拉伯数字,遗憾的是阿拉伯数字100居然排在1和2之前!所以必须设置为3位数字才行!否则顺序是乱的. 以下是用VBA批量重命名的代码: Dim FSO As ...
- cs231n spring 2017 lecture15 Efficient Methods and Hardware for Deep Learning
讲课嘉宾是Song Han,个人主页 Stanford:https://stanford.edu/~songhan/:MIT:https://mtlsites.mit.edu/songhan/. 1. ...
- 最小生成树 HihoCoder-1097、1098、1109(最小生成树算法)
太久没写最小生成树了,快忘光了.这几天回顾了一下 最小生成树一·Prim算法 AC G++ 369ms 17MB #include "cstdio" using namespace ...
- IIS6.0远程命令执行
0X00 漏洞信息: 漏洞编号:CVE-2017-7269 漏洞简述:开启WebDAV服务的IIS 6.0被爆存在缓存区溢出漏洞导致远程代码执行,目前针对 Windows Server2003 R2 ...
- 吴裕雄--天生自然python学习笔记:Python3 网络编程
Python 提供了两个级别访问的网络服务.: 低级别的网络服务支持基本的 Socket,它提供了标准的 BSD Sockets API,可以访问底层操作系统Socket接口的全部方法. 高级别的网络 ...
- phpStrom安装PHP_CodeSniffer检查代码规范
为什么使用PHP_CodeSniffer 一个开发团队统一的编码风格,有助于他人对代码的理解和维护,对于大项目来说尤其重要. PHP_CodeSniffer是PEAR中的一个用PHP5写的用来检查嗅探 ...
- Linux上SVN安装
SVN,Subversion,是一个开源的版本控制系统. svn有两种运行方式:独立的服务器和借助apache运行,各有利弊.
- vue watch和computed的使用场景
watch 监听某个数据的变化(监听完调用什么函数) 一个数据影响多个数据 (比如:浏览器自适应.监控路由对象.监控自身属性变化) computed 计算后返回新 一个数据受多个数据影响(比如:计算总 ...