Summary of the $watch of method in Vue. Js

Preface

Recently, the company uses vue framework to write interaction, which has not been written before, but many data bidirectional binding things are very similar to angular! So get started quickly! Ha ha

Today, I encountered a problem of vue! ! Product requirements are, datetimepick time selector 1 changes the time, on the re-ajax to obtain data rendering charts, very simple requirements ah! Use angula ng-change to monitor inpu box, and get it done in minutes! Use special js native on-change to get it done in minutes! The problem is that NIMA's VueJs to input box has no change event! Nima is cheating! (I don't know if I didn't find it. Anyway, there is no api, and there is no goole for a long time. If there is, please leave a message and tell me, thank you!!)

Turn over half a day api finally changed $watch () method, just get this requirement, I combed the method as follows, $watch () monitoring a value (bidirectional binding) changes, 1 once changes, call the method in quotation marks, so as to achieve the effect of change event monitoring! !

Sample code

var v_assetManage_controller = new Vue({ 
 el: '.LSee-index', 
 data: { 
  trendQueryTimeCtr: { 
   startTime: '', 
   endTime: '' 
  } 
 }, 
 ready: function() { 
  // 
 }, 
 methods: { 
  queryTrendData: function(){ 
   //do some here 
  } 
 }, 
 watch: { 
  'trendQueryTimeCtr.startTime': 'queryTrendData', 
  'trendQueryTimeCtr.endTime': 'queryTrendData' 
 } 
 
}); 

Summarize