构造器

每个 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. ionic2添加自定义文字

    上次更新到如何添加自定义图标,紧接着这次更新ionic2如何添加自定义字体 首先你要有自己的字体文件以.ttf结尾的文件字体 :推荐个字体文件网站(相对来说流氓软件比较少的)http://www.ps ...

  2. docker (centOS 7) 使用笔记5 - weave网络

    weave官网 https://www.weave.works 1. 下载安装 sudo curl -L git.io/weave -o /usr/local/bin/weave sudo chmod ...

  3. Python Spider

    一.网络爬虫 网络爬虫又被称为网络蜘蛛(

  4. Java学习路线-基础篇!

    下面以黑马程序员Java学院的学习路线为例,进行一次史无前例的剖析,我会采取连载的形式,细致的讲解零基础的人怎么学习Java.先看下Java在基础阶段的知识点路线图. 内容多吗?不要被吓到了,知识点剖 ...

  5. Bluedroid之GKI

    1. 概述 GKI以库libbt-brcm_gki.a的形式提供给Bluedroid使用 该层是一个适配层,适配了OS相关的进程.内存相关的管理,还可以用于线程间传递消息 主要通过变量gki_cb(结 ...

  6. android基本控件学习-----ToggleButton&Switch

    ToggleButton(开关按钮)和Switch(开关)讲解: 一.核心属性讲解: (1)ToggleButton textOn:按钮被选中的时候文字显示 textOff:按钮没有被选中的时候文字显 ...

  7. android中提示&对话框----Notification

    Notification(状态栏通知) 一.Notification用于状态栏显示通知的控件,在不同的设备上面Notification是不一样的 二.Notification的基本布局 元素组成: I ...

  8. Qualcomm download 所需要的 contents.xml

    Platform MSM8917 PM8937 PMI8940 在 Qualcomm code base 中, amss下有許多 MSM89xx 之類的 folder, 這些是為了不同 chip 所產 ...

  9. 转:C#制作ORM映射学习笔记三 ORM映射实现

    现在开始实现ORM的主体模块,首先需要在项目中新建一个类,命名为DbAccess,然后在项目的引用中添加两个dll,分别是MySql.Data.dll和System.Data.SQLite.dll,这 ...

  10. Android进阶之Fragment与Activity之间的数据交互

    1 为什么 因为Fragment和Activity一样是具有生命周期,不是一般的bean通过构造函数传值,会造成异常. 2 Activity把值传递给Fragment 2.1 第一种方式,也是最常用的 ...