Вызвать метод js из функции jQuery

Question

Я хочу вызвать метод handleContextEdit из обратного вызова функции eventRender, который я пробовал с помощью this.handleContextEdit(event); Но это не работает. Пожалуйста, помогите мне.

export default class FullCalendarJs extends LightningElement {
initialiseFullCalendarJs() {
  
  const ele = this.template.querySelector('div.fullcalendarjs');
 
  $(ele).fullCalendar({
    // this.calendar = new FullCalendar.Calendar(ele,{
    header: {
        left: 'prev,next, today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    //themeSystem:'bootstrap3',
    plugins: [ 'momentTimezone' ],
    defaultDate: moment(),
    
    navLinks: true, // can click day/week names to navigate views
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    events: this.programEventList,

   
    eventRender:function(event, element){
      var originalClass = element[0].className;
      element[0].className = originalClass + ' hasmenu';
      $(ele).contextMenu({
        selector: '.hasmenu', 
        callback: function(key, options,e) {
          
          this.handleContextEdit(event); //this is undefined here
        },
        items: {
            "view": {name: "View", icon: "view"},
            "edit": {name: "Edit", icon: "edit"}, 
            "delete": {name: "Delete", icon: "delete"},
            "sep1": "---------",
            "quit": {name: "Quit", icon: function(){
                return 'context-menu-icon context-menu-icon-quit';
            }}
        }
    });
    }
  });
  $(ele).fullCalendar('render');
}

handleContextEdit(event){
  console.log(event);
}
}

Я хочу вызвать метод handleContextEdit из обратного вызова функции eventRender, который я пробовал с помощью this.handleContextEdit(event); Но это не работает. Пожалуйста, помогите мне. Благодарность!!

Answer 1

Попробуйте под кодом

this.handleContextEdit(event); может не содержать ссылку на компонент,

Следовательно, вы создаете переменную в начале, чтобы удерживать this контекст

В приведенном ниже примере я создал переменную self

let self = this;

и вызов функции выглядит self.handleContextEdit(event); вместо того this.handleContextEdit(event);

export default class FullCalendarJs extends LightningElement {
initialiseFullCalendarJs() {

const ele = this.template.querySelector('div.fullcalendarjs');

let self = this;
$(ele).fullCalendar({
// this.calendar = new FullCalendar.Calendar(ele,{
header: {
    left: 'prev,next, today',
    center: 'title',
    right: 'month,agendaWeek,agendaDay'
},
//themeSystem:'bootstrap3',
plugins: [ 'momentTimezone' ],
defaultDate: moment(),

navLinks: true, // can click day/week names to navigate views
editable: true,
eventLimit: true, // allow "more" link when too many events
events: this.programEventList,


eventRender:function(event, element){
  var originalClass = element[0].className;
  element[0].className = originalClass + ' hasmenu';
  $(ele).contextMenu({
    selector: '.hasmenu', 
    callback: function(key, options,e) {

      self.handleContextEdit(event); 
    },
    items: {
        "view": {name: "View", icon: "view"},
        "edit": {name: "Edit", icon: "edit"}, 
        "delete": {name: "Delete", icon: "delete"},
        "sep1": "---------",
        "quit": {name: "Quit", icon: function(){
            return 'context-menu-icon context-menu-icon-quit';
            }}
         }
        });
      }
   });
   $(ele).fullCalendar('render');
   }

  handleContextEdit(event){
    console.log(event);
  }
}