Javascript HTML - widget

Bonjour, si je veux ajouter une liste à puces au menu hamburger à partir des sous-menus que je vois soit au clic, soit au survol de la souris, dois-je procéder ainsi ou existe-t-il une méthode plus efficace ?

Je peux ajouter des éléments individuels au menu hamburger via un composant, mais j’ai besoin de fournir des sous-éléments qui seront affichés au survol.

Pouvez-vous me conseiller ? Merci.

<script type="text/discourse-plugin" version="0.1">
  api.decorateWidget('menu-links:before', helper => {
    return helper.h("li", [
    helper.h("a.google", {
        href:"https://google.com",
        title: "Google",
        }, helper.h('p', 'Google')),
    ]);
  });
</script>

EDIT : RÉSOLU

Mais encore une chose, comment ajouter target blank ?

2 « J'aime »

Retourner un widget :

Vous pourriez retourner votre propre widget personnalisé à api.decorateWidget, ce qui vous donnera beaucoup plus de contrôle en termes d’application d’attributs, d’état, d’actions, etc.

Vous pourriez donc faire :

api.decorateWidget('menu-links:before', helper => {
   return helper.widget.attach("custom-menu-links");
});

Ensuite, à l’intérieur de javascripts/discourse/widgets/custom-menu-links.js, créez un widget en utilisant l’aide createWidget :

import { createWidget } from 'discourse/widgets/widget';

createWidget('custom-menu-links', {
...
});

Jetez un œil à ce sujet pour découvrir certaines des fonctionnalités des Widgets :

J’ai beaucoup utilisé les widgets dans mon composant de thème d’en-tête déroulant, vous pourriez trouver certains du code utiles.

Ajouter target=“_blank”

Vous l’ajoutez à l’objet attributes :

      return helper.h('a.google',
        {
          attributes: {
            href: "https://google.com",
            target: "_blank",
            title: "Google"
          },
        }
        ...
      );
2 « J'aime »