Want to create gesture, need to emit event. but can't

following the doc here

using the template/script approach where do I put this code?
I need reference to the element

so I can use ref (someplace) or a directive to get to the element.

doing the latter,

 <ion-row ref="info.Type" v-for="(row,i) in data[info.Type+'s']" :key="row+'.Name'"
      v-press @press="deleteRow(i, info.Type)"
      @dbltap="addeditClicked(2,i,info.Type,'edit')"

directives:{
    press: {
      created:function(el){
        console.log("dbltap created")
        console.log("parms="+JSON.stringify(el,' ',2))
      },
      mounted(el){
        let lastOnStart = 0;
        const onStart = function(data) {
            const DOUBLE_CLICK_THRESHOLD = 500;

            const now = Date.now();

            if (Math.abs(now - lastOnStart) <= DOUBLE_CLICK_THRESHOLD) {
              console.log("should fire")
              data.$emit('dbltap')
              lastOnStart = 0;
            } else {
              lastOnStart = now;
            }
          }
        const gesture = createGesture({
          el:el,
          threshold: 0,
          onStart: (data) => { onStart(data); },
          data:this
        });

        gesture.enable();

      },
      bind: function(){
         console.log("dbltap bind called")
      },
      unbind: function(){
         console.log("dbltap unbind called")
      }
    },

get the onStart() handler called, but I need to trigger an event… so I want to emit…
but ‘this’ is not in the handler
(oh there a unknown number of data rows I need to attach this event to)

double click is to edit the existing row, and long press is to delete the data contained on this row from the databae (with a confirmation prompt)

1 post - 1 participant

Read full topic