mirror of
https://github.com/storybookjs/storybook.git
synced 2025-04-08 11:11:53 +08:00
30 lines
595 B
Plaintext
30 lines
595 B
Plaintext
```md
|
|
<!-- MyComponent.stories.mdx -->
|
|
|
|
import { Meta, Story } from '@storybook/addon-docs';
|
|
|
|
import imageFile from './static/image.png'
|
|
|
|
<Meta title="img" component={MyComponent}/>
|
|
|
|
export const image = {
|
|
src: imageFile,
|
|
alt: "my image",
|
|
};
|
|
|
|
<!-- Render functions are a framework specific feature to allow you control on how the component renders -->
|
|
|
|
<Story
|
|
name="withAnImage"
|
|
render={() => ({
|
|
props: {
|
|
src: {
|
|
default: () => image.src,
|
|
},
|
|
alt: {
|
|
default: () => image.alt,
|
|
},
|
|
},
|
|
template: `<img :src="src" :alt="alt"/>`,
|
|
})} />
|
|
``` |