Vue.prototype的用法
基础事例:
在vue项目main.js文件中:
Vue.prototype.$appName = 'My App'
这样你可以通过在原型上定义它们使其在每个 Vue 的实例中可用。
new Vue({
beforeCreate: function () {
console.log(this.$appName)
}
})
控制台会打印出 My App。就这么简单!
“为什么 appName 要以 $ 开头?这很重要吗?它会怎样?”
$ 是在 Vue 所有实例中都可用的属性的一个简单约定。这样做会避免和已被定义的数据、方法、计算属性产生冲突。
比如写成:
Vue.prototype.appName = 'My App'
在vue实例中:
new Vue({
data: {
appName: 'The name of some other app'
},
beforeCreate: function () {
console.log(this.appName)
},
created: function () {
console.log(this.appName)
}
})
日志中会先出现 "My App",然后出现 "The name of some other app",因为 this.appName 在实例被创建之后被 data 覆写了。我们通过 $ 为实例属性设置作用域来避免这种事情发生。你还可以根据你的喜好使用自己的约定,诸如 $_appName或 ΩappName,来避免和插件或未来的插件相冲突。
内容来自vue官网 https://cn.vuejs.org/v2/cookbook/adding-instance-properties.html
Vue.prototype的用法的更多相关文章
- Vue组件基础用法
前面的话 组件(Component)是Vue.js最强大的功能之一.组件可以扩展HTML元素,封装可重用的代码.根据项目需求,抽象出一些组件,每个组件里包含了展现.功能和样式.每个页面,根据自己所需, ...
- checkbox在vue中的用法小结
关于checkbox多选框是再常见不过的了,几乎很多地方都会用到,这两天在使用vue框架时需要用到checkbox多选功能,实在着实让我头疼,vue和原生checkbox用法不太一样,之前对于vue插 ...
- checkbox在vue中的用法总结
前言 关于checkbox多选框是再常见不过的了,几乎很多地方都会用到,这两天在使用vue框架时需要用到checkbox多选功能,实在着实让我头疼,vue和原生checkbox用法不太一样, 之前对于 ...
- Vue.prototype 全局变量
有两种都是在main.js声明 第一种 main.js 声明 Vue.config.productionTip = false // mount axios Vue.$http and this.$h ...
- Vue.prototype详解
参考地址:Vue.prototype详解 如果需要设置 全局变量,在main.js中,Vue实例化的代码里添加. 不想污染全局作用域.这种情况下,你可以通过在 原型 上定义它们使其在每个Vue实例中可 ...
- 使用Vue.prototype在vue中注册和使用全局变量
在main.js中添加一个变量到Vue.prototype Vue.prototype.$appName = 'My App' 这样 $appName 就在所有的 Vue 实例中可用了,甚至在实例被创 ...
- vue.prototype和vue.use的区别和注意点
1.vue.prototype:实例上挂载属性/方法,例如Vue.prototype.axios = axios; 2.vue.use:引入插件,例如vuex,vue.use(vuex)如图,vue. ...
- Vue slot 插槽用法:自定义列表组件
Vue 框架的插槽(slot)功能相对于常用的 v-for, v-if 等指令使用频率少得多,但在实现可复用的自定义组件时十分有用.例如,如果经常使用前端组件库的话,就会经常看到类似的用法: < ...
- Array.prototype.slice && Array.prototype.splice 用法阐述
目的 对于这两个数组操作接口,由于不理解, 往往被误用, 或者不知道如何使用.本文尝试给出容易理解的阐述. 数组 什么是数组? 数组是一个基本的数据结构, 是一个在内存中依照线性方式组织元素的方式, ...
随机推荐
- BZOJ 2693: jzptab 莫比乌斯反演 + 积性函数 +筛法
Code: #include<bits/stdc++.h> #define ll long long #define M 10001000 #define maxn 10200100 #d ...
- UVA-1572 Self-Assembly(拓扑排序判断有向环)
题目: 给出几种正方形,每种正方形有无穷多个.在连接的时候正方形可以旋转.翻转. 正方形的每条边上都有一个大写英文字母加‘+’或‘-’.00,当字母相同符号不同时,这两条边可以相连接,00不能和任何边 ...
- Python学习-字符串函数操作2
字符串函数操作 find( sub, start=None, end=None):从左到右开始查找目标子序列,找到了结束查找返回下标值,没找到返回 -1 sub:需要查找的字符串 start=None ...
- LA 3029 City Game
LA 3029 求最大子矩阵问题,主要考虑枚举方法,直接枚举肯定是不行的,因为一个大矩阵的子矩阵个数是指数级的,因此应该考虑先进行枚举前的扫描工作. 使用left,right,up数组分别记录从i,j ...
- springcloud(八):熔断器Hystrix
熔断器 雪崩效应 在微服务架构中通常会有多个服务层调用,基础服务的故障可能会导致级联故障,进而造成整个系统不可用的情况,这种现象被称为服务雪崩效应.服务雪崩效应是一种因“服务提供者”的不可用导致“服务 ...
- 《Spring Boot 那些事》
<Spring Boot 那些事>----https://www.bysocket.com/?p=1124
- Codeforces Round #246 (Div. 2) D. Prefixes and Suffixes
D. Prefixes and Suffixes You have a string s = s ...
- oracle中的类似BIN$MrkCYT9eTTK+0sStMwn7+Q==$0的表的作用
https://www.2cto.com/database/201211/166482.html https://docs.oracle.com/cd/E11882_01/server.112/e40 ...
- Ubuntu 16.04安装GIMP替代PS
GIMP虽然不能完全替代PS,但是也能弥补一下. 系统默认源中已经包含了GIMP,不需要使用PPA这些. 安装: sudo apt-get install gimp 启动: 通过Dash搜索GIMP即 ...
- Windows Server下把BAT批处理注册成服务在后台运行且注销后能正常运行
批处理有如下特点: 1.登录到当前窗口运行时,如果关闭控制台会连同启动的程序一起关闭. 2.如果是以start /b的形式启动,那么同样也是在控制台关闭后者注销当前窗口也会一起关闭. 3.如果以vbs ...