storybook - 在故事书 6 中禁用每个故事的 Canvas

Question

我试图在新的故事书 6 中找到一种在故事级别禁用 Canvas 的方法。我正在制作一个组件库，并且根据故事，其中一些将只有 Canvas ，而其他人将只有文档。
我试过使用

myStory.parameters = {
  previewTabs: {
    canvas: {
      hidden: true,
    },
  },
};

或者

myStory.parameters = {
  previewTabs: {
    'storybook/docs/panel': {
      hidden: false,
    },
  },
};

取决于故事。但是，这会导致没有显示选项卡名称。因此，会发生以下情况:

我有故事 1 - 只有 Canvas 可见

我有故事 2 - 只有文档可见

我点击了故事 1 - 我看到了 Canvas ，正如预期的那样

我点击了故事 2 - 我也看到了 Canvas ，即使它是隐藏的(我想是因为标签已经从上一个故事中保留下来了)。好像这还不够糟糕，我什至无法单击文档，因为看不到选项卡名称。

反过来也是一样的(如果我从故事 2 开始)

作为文档的解决方法，我发现了这个(感谢 Benjamin ，在这篇文章 here 中):

myStory.parameters = {
  docs: { page: null },
};

有了这个，我仍然可以看到 Canvas 和文档选项卡，但是对于设置了这个参数的故事，文档一个现在是空的。
我正在寻找为 Canvas 做类似的事情，并尝试过

myStory.parameters = {
  canvas: { page: null },
};

myStory.parameters = {
  canvas: { disabled: true },
};

但没有工作。

Answer 1

我不知道这个解决方案是否适合您的需求，但我发现的解决方法是在 .mdx 中写我的故事。并在 Meta 上禁用 Canvas :

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

<Meta
  title="Section/MyComponent"
  parameters={{
    viewMode: 'docs',
    previewTabs: { 
      canvas: { hidden: true } 
     },
  }}
/>

# My markdown title

<Canvas>
  <Story name="mycomponent">
    <MyComponent />
  </Story>
</Canvas>