ContextQMD
Back to Storybook

Csf 3 Example Render

docs/_snippets/csf-3-example-render.md

10.3.62.5 KB
Original Source
ts
// Other imports and story implementation
export const Basic: Story = {
  render: (args) => ({
    props: args,
  }),
};
js
// Other imports and story implementation
export const Basic = {
  render: (args) => <Button {...args} />,
};
ts
// Other imports and story implementation
export const Basic: Story = {
  render: (args) => <Button {...args} />,
};
js
// Other imports and story implementation
export const Basic = {
  render: (args) => <Button {...args} />,
};
ts
// Other imports and story implementation
export const Basic: Story = {
  render: (args) => <Button {...args} />,
};
js
// Other imports and story implementation
export const Basic = {
  render: (args) => ({
    Component: Button,
    props: args,
  });
};
ts
// Other imports and story implementation
export const Basic: Story = {
  render: (args) => ({
    Component: Button,
    props: args,
  }),
};
js
// Other imports and story implementation
export const Basic = {
  render: (args) => ({
    components: { Button },
    setup() {
      return { args };
    },
    template: '<Button v-bind="args" />',
  }),
};
ts
// Other imports and story implementation
export const Basic: Story = {
  render: (args) => ({
    components: { Button },
    setup() {
      return { args };
    },
    template: '<Button v-bind="args" />',
  }),
};
js
// Other imports and story implementation

export const Basic = {
  render: (args) => html`<demo-button label="Hello" @click=${action('clicked')}></demo-button>`,
};
ts
// Other imports and story implementation

export const Basic: Story = {
  render: (args) => html`<demo-button label="Hello" @click=${action('clicked')}></demo-button>`,
};