一聚教程网:一个值得你收藏的教程网站

最新下载

热门教程

Vue.Js中的$watch()方法总结

时间:2022-06-29 01:26:08 编辑:袖梨 来源:一聚教程网

最近公司用vue框架写交互,之前没怎么写过,但是很多数据双向绑定的东东跟angular很像!所以上手很快!哈哈

今天就碰到一个vue的问题啊!!产品需求是,datetimepick时间选择器一更改时间,就重新ajax获取数据渲染图表,很简单的需求啊!用angula  ng-change监听inpu框框,分分钟搞定啊!用特么js原生  on-change也分分钟搞定啊!问题是尼玛的VueJs对input框没有change事件!尼玛坑爹啊!(不知道是不是我没找到,反正api里没有,goole了半天,也没有,要是有的话,麻烦留言告诉我,谢谢!!)

翻了半天api最后换了$watch()方法,才搞定这个需求,我梳理了方法如下,$watch()监听某个值(双向绑定)的变化,一旦发生变化,就调用引号里的方法,从而达到change事件监听的效果!!

示例代码

 

 代码如下复制代码

varv_assetManage_controller =newVue({

 el:'.LSee-index',

 data: {

  trendQueryTimeCtr: {

   startTime:'',

   endTime:''

  }

 },

 ready:function() {

  //

 },

 methods: {

  queryTrendData:function(){

   //do some here

  }

 },

 watch: {

  'trendQueryTimeCtr.startTime':'queryTrendData',

  'trendQueryTimeCtr.endTime':'queryTrendData'

 }

  

});

 

热门栏目