构造器

每个 Vue.js 应用都是通过构造函数 Vue 创建一个 Vue 的根实例来启动的:

var vm = new Vue({
// 选项
})

属性与方法

每个 Vue 实例都会代理其 data 对象里所有的属性:

var data = { a: 1 }
var vm = new Vue({
data: data
})
vm.a === data.a // -> true
// 设置属性也会影响到原始数据
vm.a = 2
data.a // -> 2
// ... 反之亦然
data.a = 3
vm.a // -> 3

除了 data 属性, Vue 实例暴露了一些有用的实例属性与方法。这些属性与方法都有前缀 $,以便与代理的 data 属性区分。例如:

var data = { a: 1 }
var vm = new Vue({
el: '#example',
data: data
})
vm.$data === data // -> true
vm.$el === document.getElementById('example') // -> true
// $watch 是一个实例方法
vm.$watch('a', function (newVal, oldVal) {
// 这个回调将在 `vm.a` 改变后调用
})

VueJS构造器:new Vue({})的更多相关文章

  1. 【Vuejs】350- 学习 Vue 源码的必要知识储备

    前言 我最近在写 Vue 进阶的内容.在这个过程中,有些人问我看 Vue 源码需要有哪些准备吗?所以也就有了这篇计划之外的文章. 当你想学习 Vue 源码的时候,需要有扎实的 JavaScript 基 ...

  2. Vue基础---->VueJS的使用(一)

    Vue.js是一个构建数据驱动的web界面的库.它的目标是通过尽可能简单的API 实现响应的数据绑定和组合的视图组件,今天我们就开始vue.js的学习. vue的安装及使用 一.vue的下载地址:ht ...

  3. vuejs 单文件组件.vue 文件

    vuejs 自定义了一种.vue文件,可以把html, css, js 写到一个文件中,从而实现了对一个组件的封装, 一个.vue 文件就是一个单独的组件.由于.vue文件是自定义的,浏览器不认识,所 ...

  4. Vue2.0 - 构造器的延伸 Vue.extend

    Vue.extend 返回的是一个“扩展实例构造器”,也就是预设了部分选项的Vue实例构造器.经常服务于Vue.component用来生成组件,可以简单理解为当在模板中遇到该组件名称作为标签的自定义元 ...

  5. 2、Vue构造器和扩展

    1.VUE构造器简介 VUE构造器是一个非常重要的语法. 每个Vue.js应用都是通过构造函数Vue创建一个根实例. New了Vue对象,然后调用了这个vue对象的构造器,并向构造器传入了数据. 在实 ...

  6. Vue2.0 【第二季】第2节 Vue.extend构造器的延伸

    目录 Vue2.0 [第二季]第2节 Vue.extend构造器的延伸 一.什么是Vue.extend 二.自定义无参数标签 三.挂载到普通标签上 Vue2.0 [第二季]第2节 Vue.extend ...

  7. Vue.2.0.5-Vue 实例

    构造器 每个 Vue.js 应用都是通过构造函数 Vue 创建一个 Vue 的根实例 启动的: var vm = new Vue({ // 选项 }) 虽然没有完全遵循 MVVM 模式, Vue 的设 ...

  8. 对Vuejs框架原理名词解读

    渐进式()+虚拟Dom: vue-cli 遍历Dom:先序遍历DOM树的5种方法! 三层架构+m v c +mvp+m v vm()+MVC,MVP 和 MVVM 的图示 剖析vue MVVM实现原理 ...

  9. 三十分钟学完Vue

    基础知识: vue的生命周期: beforeCreate/created. beforeMount/mounted. beforeUpdate/updated. beforeDestory/desto ...

随机推荐

  1. Codeforces Round #323 (Div. 2) C 无敌gcd 数学/贪心

    C. GCD Table time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...

  2. 检测字符串当中x与o的数目是否相等

    题目如上 答案 function XO(str) { var arr = str.split(""), xCount = , oCount = ; var reX = /x/i, ...

  3. Accelerating Enum-Based Dictionaries with Generic EnumComparer

    原文发布时间为:2011-03-03 -- 来源于本人的百度文章 [由搬家工具导入] 文章:http://www.codeproject.com/KB/cs/EnumComparer.aspx 源码: ...

  4. 张孝祥JavaScript视频教程flash版

    原文发布时间为:2008-09-16 -- 来源于本人的百度文章 [由搬家工具导入] 之前论坛有人发过RM版的,容量差不多有10G.现在这个是flash版的,只有1.2G共七部分. 第一部分:http ...

  5. Python学习杂记_4_分支和循环

    分支 和 循环 分支和循环这俩结构在各语言中都有着很重要的地位,当然我之前都没有学好,这里总结一下在Python学习中对这俩结构的认识. 分支结构 # 单分支 if 条件判断: 执行语句… # 双分支 ...

  6. 使用jquery完成定时弹出广告图片

    <script src="../js/jquery-1.8.3.js"></script> <script type="text/javas ...

  7. vSphere虚拟化ESXI6.0+vclient安装部署

      知识部分:一.什么是vSphere?vSphere是VNware公司在2001年基于云计算推出的一套企业级虚拟化解决方案.核心组件为ESXi.如今,经历了5个版本的改进,已经实现了虚拟化基础架构. ...

  8. 深度学习_2_CNN

    Basic Conception: 感受野(Reception Field) 权值共享(shared weights) 池化,即降采样(sub-Sampling) 卷积核(kernel,filter) ...

  9. CodeForces - 361D Levko and Array

    Discription Levko has an array that consists of integers: a1, a2, ... , an. But he doesn’t like this ...

  10. Hadoop1和Hadoop2的区别是什么?

    [学习笔记] Hadoop1和Hadoop2的区别是什么?马 克-to-win @ 马克java社区:原来的Hadoop1的Mapreduce又管资源管理,又管数据处理和计算.而Hadoop2中的Ma ...