这篇文章主要介绍“vue对象的侦听属性怎么表示”，在日常操作中，相信很多人在vue对象的侦听属性怎么表示问题上存在疑惑，小编查阅了各式资料，整理出简单好用的操作方法，希望对大家解答”vue对象的侦听属性怎么表示”的疑惑有所帮助！接下来，请跟着小编一起来学习吧！
创新互联服务项目包括上杭网站建设、上杭网站制作、上杭网页制作以及上杭网络营销策划等。多年来，我们专注于互联网行业，利用自身积累的技术优势、行业经验、深度合作伙伴关系等，向广大中小型企业、政府机构等提供互联网行业的解决方案，上杭网站推广取得了明显的社会效益与经济效益。目前，我们服务的客户以成都为中心已经辐射到上杭省份的部分城市，未来相信会继续扩大服务区域并继续获得客户的支持与信任！
vue对象的侦听属性用“watch”表示。所谓监听就是对内置对象的状态或者属性变化进行监听并且做出反应的响应，监听属性，意思就是可以监视其他数据的变化。vue中监听属性有两种写法：1、在“new Vue()”中传入watch配置；2、通过“vm.$watch”进行监听。
watch 侦听属性
所谓监听就是对内置对象的状态或者属性变化进行监听并且做出反应的响应，监听属性，意思就是可以监视其他数据的变化。
有的时候，我们需要的派生数据是通过异步的方式处理的，这个时候，计算属性就不太好用了（不能处理异步）。我们可以使用另外一个选项：watch
watch : 侦听属性；监听的是data的属性，当属性发生改变以后，会做的一些事情
监听属性有两种写法，如下：
new Vue()中传入watch配置。
通过vm.$watch进行监听。
看个具体的例子。
在new Vue()中传入watch配置。
今天天气很{{info}}
如果watch isHot 时，只提供了回调函数handler，如下：
watch:{
isHot:{
handler(newValue,oldValue){
console.log("isHot:newValue="+newValue,"oldValue="+oldValue);
}
}}
则可以简写成如下形式：
watch:{
isHot(newValue,oldValue){
console.log("isHot:newValue="+newValue,"oldValue="+oldValue);
}}
通过vm.$watch进行监听。
今天天气很{{info}}
如果watch isHot时，只提供了handler，如下：
vm.$watch("isHot",{
handler(newValue,oldValue){
console.log("isHot:newValue="+newValue,"oldValue="+oldValue);
}})
则可以简写成以下形式：
vm.$watch("isHot",function(newValue,oldValue){
console.log("isHot:newValue="+newValue,"oldValue="+oldValue);})
打开浏览器，测试下。
a的值是{{numbers.a}}
监听多级结构的某个属性，如numbers.a，当numbers对象的a属性发生变化时，Vue将侦听到，并执行回调handler。
监听多级结构的所有属性（深度监听），如"numbers":{deep:true}，当numbers对象的任一属性发生变化，Vue也能侦听到，并执行回到handler。
监听属性和计算属性
名：
全名：{{fullName}}
名：
全名：{{fullName}}
可以看到：计算属性能够完成的，监听属性一定能够完成。
但，监听属性能够完成的，计算属性不一定能够完成，比如当数据变化时执行异步操作。看个具体的例子：当firstName变化时，等1秒后，fullName才变化。
名：
全名：{{fullName}}
【vue】方法、计算属性、数据监听也对计算属性和监听属性做过对比。虽然计算属性在大多数情况下更合适，但当需要在数据变化时执行异步操作时，监听属性更有用。
另外，再次建议：
由Vue管理的函数，最好写成普通函数，这样函数中的this指向才是Vue实例。
不被Vue管理的函数，如定时器函数、ajax回调函数、promise函数，最好写成箭头函数。因为箭头函数没有自己的this。
到此，关于“vue对象的侦听属性怎么表示”的学习就结束了，希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习，快去试试吧！若想继续学习更多相关知识，请继续关注创新互联网站，小编会继续努力为大家带来更多实用的文章！
