vue.prototype怎么使用-创新互联
这篇文章主要介绍vue.prototype怎么使用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
目前创新互联公司已为上千余家的企业提供了网站建设、域名、虚拟主机、绵阳服务器托管、企业网站设计、绩溪网站维护等服务,公司将坚持客户导向、应用为本的策略,正道将秉承"和谐、参与、激情"的文化,与客户和合作伙伴齐心协力一起成长,共同发展。vue.prototype的使用方法:通过在原型上定义使其在每个Vue的实例中可用,代码为【Vue.prototype.$appName = 'My App'】,控制台会打印出My App。
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.prototype怎么使用”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注创新互联行业资讯频道!
本文标题:vue.prototype怎么使用-创新互联
本文来源:http://pwwzsj.com/article/cscdeh.html