vue中的$符号
$是在vue中所有实例中都可用的一个简单约定,这样做会避免和已被定义的数据,方法,计算属性产生冲突。另一个好问题!如果你写成:Vue.prototype.appName = 'My App';那么你希望下面的代码输出什么呢?new Vue({data: {// 啊哦,`appName` *也*是一个我们定义的实例属性名!appName: 'The name of some other app'},
·
$是在vue中所有实例中都可用的一个简单约定,这样做会避免和已被定义的数据,方法,计算属性产生冲突。
另一个好问题!如果你写成:
Vue.prototype.appName = 'My App';
那么你希望下面的代码输出什么呢?
new Vue({
data: {
// 啊哦,`appName` *也*是一个我们定义的实例属性名!
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的实例属性和方法
除了数据属性,Vue 实例还暴露了一些有用的实例属性与方法。它们都有前缀 $,以便与用户定义的属性区分开来。例如:
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 (newValue, oldValue) {
// 这个回调将在 `vm.a` 改变后调用
})
Jquery中
利用$作为选择器,其实是jquery库对原生JavaScript对选择元素进行的一种封装!
更多推荐
已为社区贡献11条内容
所有评论(0)