storybook - 是否可以在 Storybook 中为函数/类(非 ui 元素)编写文档？

Question

Storybook 非常适合展示和记录组件，但我也有一些实用函数和类，我想添加到 storybook 中，是否可以使用它的控件作为这些函数参数？

Answer 1

要为非 UI 元素编写文档，只需使用 MDX 文件即可。

去抖功能:

import { FnType } from 'types';
import { generateError } from 'utils';

let timer;

export default function debounce(fn: FnType, timeout: number = 300) {
  try {
    return (...args) => {
      if (!timer) fn.apply(this, args);
      clearTimeout(timer);
      timer = setTimeout(() => (timer = undefined), timeout);
    };
  } catch (e) {
    generateError(e);
  }
}

debounce.stories.mdx:

import { Meta } from '@storybook/addon-docs';

<Meta title="Debounce" />

## Debounce the execution of a given function

### Syntax: debounce(fn , timeout)

- fn: callback function
- timeout: timout value in ms

#### Usage:

const doSomeThing = () => {console.log("doing...")}

debounce (doSomeThing , 300)

这是我的 utils 文件夹(非 UI)

注意我正在使用故事书版本 6