SoFunction
Updated on 2025-04-03

Custom directives in vue change the value in data

A drag command is implemented through local custom command

html:

<div style="position:absolute;width:100px;height:100px;border:1px solid red" v-drag="{set:set}"></div>

script:

methods:{
set(x,y){
=x;
=y;
}
},
directives:{
// Drag custom commanddrag(el,binding){
//el is the dragged elementvar oDiv =el;
  = function(e){
  ();
     ();
  var disX = ;
  var disY = ;
   = function(e){
  ();
();
  var x=-disX;
  var y=-disY
   =x
=y
  // Pass the function in methods through parameter transfer to change the value in data  (x,y)
  };
   = function(){
  =null;
  =null;
  };
 };
}
},

The above is the custom command in vue introduced to you by the editor to change the value in data. I hope it will be helpful to you. If you have any questions, please leave me a message and the editor will reply to you in time. Thank you very much for your support for my website!