Как вызвать родительский метод внутри дочернего класса javascript


Как вызвать родительский метод внутри дочернего класса javascript

08.09.2020 11:40:48 Просмотров 1 Источник

Ниже приведен код для JS-файла компонента vue.

(предполагая, что JS-файл компонента vue является классом)

export default { -----> this is the parent, it is a component & it doesn't have a name!
  name: "mapping",
  components: {},
  props: ["data"],
  data() {
},
methods: {
parentMethod() {} ---->> this is the parent method. I want to call this inside the Rect class
},

mounted() {

class Rect { -----> this is the child class, 
constructor() {
this.parentMethod() // -> this is the parent method. how can I do this?
}

// call parent methods (i.e. component's) inside this class

//or something like this.

this.parentMethod() // -> this is the parent method. how can I do this?

}


}

Как вы можете видеть, я создаю класс под названием Rect внутри смонтированного крючка внутри класса компонентов vue js.

Я хочу вызвать методы родительского компонента внутри этого класса Rect.

Как я могу этого достичь?

ОБНОВЛЕНИЕ

Я не расширяю класс родительского компонента внутри самого себя. Я просто определяю новый класс под названием Rect внутри родительского класса компонентов. Поэтому я не думаю, что смогу позвонить super(). Хотя не уверен!!

Обновление Просматривая ответы, я пришел к выводу, что большинство из них предполагает расширение класса. Но здесь у родительского класса нет имени. Это просто export default {} in vue.

кроме того, я не уверен, смогу ли я расширить родителя внутри себя, чтобы создать новый класс внутри себя.

ЗАПИСКА

Требование состоит в том, чтобы вызвать родительский метод из / внутри класса, который является дочерним родительским классом (т. е. определен внутри родительского тела => определен внутри родительского тела) > надеюсь, что это имеет смысл!!

У вопроса есть решение - Посмотреть?

Ответы - Как вызвать родительский метод внутри дочернего класса javascript / How to call parent method inside a javascript child class

sonEtLumiere

08.09.2020 11:50:00

Проверьте расширенные и супер ключевые слова:

//Inheritance
//Parent class (superclass)
class Animal {                            
  constructor(name) {           
    this._name = name;
    this._behavior = 0;
  }
  get name() {
    return this._name;
  }
  get behavior() {
    return this._behavior;
  }   
  incrementBehavior() {
    this._behavior++;
  }
} 

//Child class (subclass)
class Cat extends Animal {          // The extends keyword makes the methods of the animal class available inside the cat class.     
  constructor(name, usesLitter) {
    super(name);                    // The super keyword calls the constructor of the parent class.
    this._usesLitter = usesLitter;
  }
    get usesLitter() {
    return this._usesLitter;
  }
}
const bryceCat = new Cat('Bryce', true);
console.log(bryceCat.name);             //Output: Bryce
console.log(bryceCat.usesLitter);       //Output: true

Является ответом!
dalmo3

09.09.2020 12:05:31

Когда вы создаете новый класс, вы меняете, кто this находится внутри этого класса. Поэтому вам нужно дать этому классу ссылку на его родителя:


mounted() {
  const parentRef = this; // reference to the parent instance

  class Rect { 
    constructor() {
      parentRef.parentMethod() 
    }

    ...

    parentRef.parentMethod() // -> this is the parent method
  }

}

Michael Rush

09.09.2020 12:11:43

В Vue вы хотите генерировать события из дочерних компонентов, которые обрабатываются родительским компонентом, а не вызывать методы родительского компонента непосредственно из дочернего.

Видишь https://vuejs.org/v2/guide/components.html#Listening-to-Child-Components-Events

Помочь в развитии проекта:
Закрыть X