vue-learning:13 - js - vue作用域概念:全局和局部
目录
- 全局作用域:
Vue对象- 全局api
- 局部作用域:
- 实例对象
vm- 实例api
- 组件
component- 组件配置选项
- 实例对象
在引入Vue文件时,就相当于拥有了一个全局Vue对象。
在var vm = new Vue(option)时,就相当于创建了一个实例对象vm
在注册一个组件后,就相当于创建了一个组件对象。
全局Vue对象的属性和方法能被所有实例对象共享,或者说继承。全局API调用是Vue打点调用。形式是:VUE.directive、VUE.filter。
一个页面中可以创建多个实例对象,比如var test = new Vue()、var example = new Vue()。实例对象的api是经过vue特定封装的,以$开始。形式是:test.$filter 、example.$data。
定义在组件内部的属性只限组件内使用。使用Vue.component()注册时为全局组件,可以被所有实例对象使用。在var test = new Vue({components:header})注册的组件为实例对象test内的局部组件,只能被test实例对象内部使用,不能被其它实例对象使用。
在组件内声明的属性或方法,可以直接用指向当前组件对象的this打点调用,形式如this.filter、this.message。此时的this也可调用当前组件所属实例对象中的属性和方法,但必须$开头,this.$options、this.$data。
从这节开始,我们进入Vue逻辑层的知识点。具体看下节内容。
vue-learning:13 - js - vue作用域概念:全局和局部的更多相关文章
- 13、vue.js简单入门
本篇导航: 介绍与安装 vue常用指令 一.介绍与安装 vue是一套构建用户界面的JAVASCRIPT框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...
- vue中eslintrc.js配置最详细介绍
本文是对vue项目中自带文件eslintrc.js的内容解析, 介绍了各个eslint配置项的作用,以及为什么这样设置. 比较详细,看完能对eslint有较为全面的了解,基本解除对该文件的疑惑. /* ...
- php开发面试题---vue面试题(vue.js的好处及作用)
php开发面试题---vue面试题(vue.js的好处及作用) 一.总结 一句话总结: 双向数据绑定:在做ajax的时候,更新实在是太方便了 用数据绑定的思想,vue可以简单写单个页面,也可以写一个大 ...
- Parcel.js + Vue 2.x 极速零配置打包体验
继 Browserify.Webpack 之后,又一款打包工具 Parcel 横空出世 Parcel.js 的官网有这样的自我介绍 “极速零配置Web应用打包工具” 简单接触了一下,单从效率上来说,确 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十五 ║Vue基础:JS面向对象&字面量& this字
缘起 书接上文<从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十四 ║ VUE 计划书 & 我的前后端开发简史>,昨天咱们说到了以我的经历说明的web开发经历的 ...
- Vue基础-匿名插槽与作用域插槽的合并和覆盖行为
Vue 测试版本:Vue.js v2.5.13 Vue 文档: <slot> 元素可以用一个特殊的特性 name 来进一步配置如何分发内容.多个插槽可以有不同的名字.具名插槽将匹配内容片段 ...
- day67:Vue:es6基本语法&vue.js基本使用&vue指令系统
目录 Vue前戏:es6的基本语法 1.es6中的let特点 1.1.局部作用域 1.2.不存在变量提升 1.3.不能重复声明 1.4.let声明的全局变量不从属于window对象,var声明的全局变 ...
- 转《vue引入第三方js库》
一.绝对路径直接引入,全局可用 二.绝对路径直接引入,配置后,import 引入后再使用 三.webpack中配置 alias,import 引入后再使用 四.webpack 中配置 plugins, ...
- Vue 组件&组件之间的通信 之全局组件与局部组件
在上篇博客中介绍了组件,在注册组件的简写中就用到了全局组件 //注册组件的简写方式 Vue.component('my-componenta',{ template:'<h2>hello ...
随机推荐
- python 正确地初始化对象
- JavaScript--tab栏切换效果
tab栏切换效果: <!DOCTYPE html> <html> <head lang="en"> <meta charset=" ...
- Balanced Binary Tree 判断平衡二叉树
Given a binary tree, determine if it is height-balanced. For this problem, a height-balanced binary ...
- (五)IO流之ByteArrayInput/OutputStream
ByteArrayInputStream:是把字节数组当成源的输入流 String string="hello shanghai"; ByteArrayInputStream bi ...
- .net 数据表格显示控件
版权声明:本文为博主原创文章.未经博主同意不得转载. https://blog.csdn.net/chenjinge7/article/details/30470609 1. GridView 控件 ...
- Java练习 SDUT-3337_计算长方体、四棱锥的表面积和体积
计算长方体.四棱锥的表面积和体积 Time Limit: 1000 ms Memory Limit: 65536 KiB Problem Description 计算如下立体图形的表面积和体积. 从图 ...
- @atcoder - AGC035E@ Develop
目录 @description@ @solution@ @accepted code@ @details@ @description@ 给定初始集合为 1 ~ N 的全集,并给定一个 K. 每次对于当 ...
- 模板—点分治B(合并子树)(洛谷P4149 [IOI2011]Race)
洛谷P4149 [IOI2011]Race 点分治作用(目前只知道这个): 求一棵树上满足条件的节点二元组(u,v)个数,比较典型的是求dis(u,v)(dis表示距离)满足条件的(u,v)个数. 算 ...
- 非常优秀的Javascript(AJAX) 开发工具:Aptana
非常优秀的Javascript(AJAX) 开发工具:Aptana 下面我要向你介绍一款非常优秀的Javascript(AJAX) 开发工具:Aptana.应为它实在太棒了,所以我忍不住想向你推荐它. ...
- 20190527-JavaScriptの打怪升级旅行 { 语句 [ 声明 ,变量 ] }
写在前面的乱七八糟:时间总是轻易地溜走,不留一丝念想,近一个月,倒是过得有点丧,从今天开始起,已经开始接触后台了,而JavaScript也只是大致有了个分类框架,那些细枝末节还有的补,任重道远,天将降 ...