Comment gérer les emplacements dans Vue3 et Storybook 7

Question

J'essaie de transmettre un composant (UIButton) comme emplacement dans un autre composant (UICard) dans l'histoire ButtonAsSlot.

Dans l'histoire ButtonAsSlot, je passe default: '', comme args.default, il sera donc transmis dans l'emplacement.

Si je pouvais transmettre une histoire existante (par exemple default : ''), alors ce serait super. Cependant, cela ne fonctionne pas.

J'ai essayé ce qui suit, mais j'ai obtenu l'erreur Erreur : identifiant inattendu de l'objet  sur Storybook.

const désactivéArgs = ImportedStory.args

exporter const ButtonAsSlot : Histoire = {
  ...Cour de récréation,
  rendu : (args, { argTypes }) =>
    composants : { UICard, UIButton },
    accessoires : Object.keys (argTypes),
    installation() {
      retour {
        ...arguments,
      }
    },
    modèle : `
      
        

Answer 1

Finalement, j'ai écrit le code comme ceci et cela a fonctionné.

import { Disabled } from 'disabled.stories'

export const ButtonAsSlot: Story = {
  ...Playground,
  args: {
    ...Playground.args,
    disabledArgs: {
      ...Disabled.args,
    },
    default: '<UIButton v-bind="disabledArgs" />',
  },
}