La fonction de la classe importée n'est pas définie

Question

J'essaie de configurer une application en utilisant des classes ES6 pour la première fois, mais j'ai de la difficulté à appeler une fonction d'une classe importée.

La classe à importer:

import {BaseElement} from './ui/base-element.js'; 

export class Product extends BaseElement { 
constructor() { 
    super() 
    this.toggleAttributes(); 
} 

// show more attributes toggle 
toggleAttiributes() { 
    const toggleButton = document.querySelectorAll('.smrt42-toggle-attr') 
    document.addEventListener('click', (e)=>{ 
     const t = e.target; 
     if(t.className.indexOf('smrt42-toggle-attr') !== -1) { 
      e.preventDefault() 
      let productAttrs = t.parentNode.previousElementSibling 
      if(t.classList.contains('smrt42-toggle-attr-more')) { 
       productAttrs.classList.add('smrt42-attr-open') 
      } else if (t.classList.contains('smrt42-toggle-attr-less')) { 
       productAttrs.classList.remove('smrt42-attr-open') 
      } 
     } 

    }) 
} 
} 

Importation de la classe ici:

import {BaseElement} from './ui/base-element.js'; 
import {Product} from './product.js'; 

export class Content extends BaseElement { 

constructor() { 
    super() 
     let p = new Product() ; 
    } 
} 

Cela donne une erreur de la console this.toggleAttributes is not a function

Answer 1

Vous avez saisi le nom de la fonction. Dans la déclaration, vous avez le nom toggleAttiributes, mais vous l'appelez toggleAttributes. Très i est ici

toggleAttiributes 
---------^-------