目录

  • 全局作用域:Vue对象

    • 全局api
  • 局部作用域:
    • 实例对象vm

      • 实例api
    • 组件component
      • 组件配置选项
在引入Vue文件时,就相当于拥有了一个全局Vue对象。
在var vm = new Vue(option)时,就相当于创建了一个实例对象vm
在注册一个组件后,就相当于创建了一个组件对象。

全局Vue对象的属性和方法能被所有实例对象共享,或者说继承。全局API调用是Vue打点调用。形式是:VUE.directiveVUE.filter

一个页面中可以创建多个实例对象,比如var test = new Vue()var example = new Vue()。实例对象的api是经过vue特定封装的,以$开始。形式是:test.$filterexample.$data

定义在组件内部的属性只限组件内使用。使用Vue.component()注册时为全局组件,可以被所有实例对象使用。在var test = new Vue({components:header})注册的组件为实例对象test内的局部组件,只能被test实例对象内部使用,不能被其它实例对象使用。

在组件内声明的属性或方法,可以直接用指向当前组件对象的this打点调用,形式如this.filterthis.message。此时的this也可调用当前组件所属实例对象中的属性和方法,但必须$开头,this.$optionsthis.$data

从这节开始,我们进入Vue逻辑层的知识点。具体看下节内容。

vue-learning:13 - js - vue作用域概念:全局和局部的更多相关文章

  1. 13、vue.js简单入门

    本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...

  2. vue中eslintrc.js配置最详细介绍

    本文是对vue项目中自带文件eslintrc.js的内容解析, 介绍了各个eslint配置项的作用,以及为什么这样设置. 比较详细,看完能对eslint有较为全面的了解,基本解除对该文件的疑惑. /* ...

  3. php开发面试题---vue面试题(vue.js的好处及作用)

    php开发面试题---vue面试题(vue.js的好处及作用) 一.总结 一句话总结: 双向数据绑定:在做ajax的时候,更新实在是太方便了 用数据绑定的思想,vue可以简单写单个页面,也可以写一个大 ...

  4. Parcel.js + Vue 2.x 极速零配置打包体验

    继 Browserify.Webpack 之后,又一款打包工具 Parcel 横空出世 Parcel.js 的官网有这样的自我介绍 “极速零配置Web应用打包工具” 简单接触了一下,单从效率上来说,确 ...

  5. 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础:JS面向对象&字面量& this字

    缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...

  6. Vue基础-匿名插槽与作用域插槽的合并和覆盖行为

    Vue 测试版本:Vue.js v2.5.13 Vue 文档: <slot> 元素可以用一个特殊的特性 name 来进一步配置如何分发内容.多个插槽可以有不同的名字.具名插槽将匹配内容片段 ...

  7. day67:Vue:es6基本语法&vue.js基本使用&vue指令系统

    目录 Vue前戏:es6的基本语法 1.es6中的let特点 1.1.局部作用域 1.2.不存在变量提升 1.3.不能重复声明 1.4.let声明的全局变量不从属于window对象,var声明的全局变 ...

  8. 转《vue引入第三方js库》

    一.绝对路径直接引入,全局可用 二.绝对路径直接引入,配置后,import 引入后再使用 三.webpack中配置 alias,import 引入后再使用 四.webpack 中配置 plugins, ...

  9. Vue 组件&组件之间的通信 之全局组件与局部组件

    在上篇博客中介绍了组件,在注册组件的简写中就用到了全局组件 //注册组件的简写方式 Vue.component('my-componenta',{ template:'<h2>hello ...

随机推荐

  1. iOS app发布流程

    http://www.xuebuyuan.com/1980497.html http://blog.csdn.net/alincexiaohao/article/details/38725367 ap ...

  2. 寻找 K8s 1.14 Release 里的“蚌中之珠”

    摘要: K8s 1.14 发布了,Release Note那么长,我们该从何读起? 本文由张磊.心贵.临石.徙远.衷源.浔鸣等同学联合撰写. Kubernetes 1.14.0 Release 已经于 ...

  3. Pyhton 单行、多行注释方法

    一.python单行注释的符号 井号#常被用作单行注释符号,在代码中使用#时,它右边的任何数据都会被忽略,当做是注释.类似c++的// 二.批量.多行注释的符号 多行注释是用三引号: ”’ 注释内容 ...

  4. 数据分析1:安装tushare安装包

    1. 2. 3.重点内容

  5. Ecplise中Junit4单元测试的基本用法

    看了一些Junit4的视频,简单了解了Junit4的一些基本用法,整理记录一下. 环境搭建 这里使用的开发工具是MyEclipse,首先新建一个Java工程,将Junit4的jar包引入,eclips ...

  6. 2019-10-21-WPF-多个-StylusPlugIn-的事件触发顺序

    title author date CreateTime categories WPF 多个 StylusPlugIn 的事件触发顺序 lindexi 2019-10-21 08:33:15 +080 ...

  7. HZOJ 集合论

    考场用的set,代码复杂度很低,时间复杂度$O(sum log)$,一发过了大样例,以为1e6的数据很稳了就没再管(然后就挂掉了……) 考后把set化成unordered_set就A了.其实$sum ...

  8. 【NS2】用eclipse调试NS2(转载)

    相信很多喜欢Java的人对eclipse都情有独钟.NS2程序的调试,可以用打印命令调试,这样太繁琐.也可以用gdb调试,个人觉得上手比较困难.相信各位学习NS2的新手,在看代码的时候,很多的函数或者 ...

  9. Linux保证运行一个实例

    1. ; // 默认最大路径长度 inline std::string current_exe_name() { }; int ret = readlink("/proc/self/exe& ...

  10. div 禁止点击

    今天需要这个需求,原来真的有 style="pointer-events: none;"