storybook/docs/snippets/vue/list-story-template.3.js.mdx
2021-09-03 23:31:04 +01:00

53 lines
909 B
Plaintext

```js
// List.stories.js
import List from './List.vue';
import ListItem from './ListItem.vue';
//👇 Imports a specific story from ListItem stories
import { Unchecked } from './ListItem.stories';
export default {
component: List,
};
//👇 The ListTemplate construct will be spread to the existing stories.
export const ListTemplate = {
render: (args) => ({
components: { List, ListItem },
setup() {
return { ...args };
},
template: `
<List v-bind="args">
<div v-for="item in items" :key="item.title">
<ListItem :item="item"/>
</div>
</List>
`,
}),
};
export const Empty = {
...ListTemplate,
args: {
items: [],
},
};
export const Empty = ListTemplate.bind({});
Empty.args = {
items: [],
};
export const OneItem = {
...ListTemplate,
args: {
items: [
{
...Unchecked.args,
},
],
},
};
```