描述bug
在使用 controls: {disable: true}
作为故事参数时,浏览器控制台会出现以下警告信息:
Warning: React has detected a change in the order of Hooks called by null. This will lead to bugs and errors if not fixed. For more information, read the Rules of Hooks:
Previous render Next render
------------------------------------------------------
1. useContext useState
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
in Unknown
in Unknown
in Unknown
in Unknown (created by ManagerConsumer)
in ManagerConsumer (created by Panel)
in Panel (created by Layout)
in div (created by Context.Consumer)
in Styled(div) (created by Panel)
in Panel (created by Layout)
in div (created by Context.Consumer)
in Styled(div) (created by Main)
in div (created by Context.Consumer)
in Styled(div) (created by Main)
in Main (created by Layout)
in Layout (created by Context.Consumer)
in WithTheme(Layout)
in Unknown
in div (created by Context.Consumer)
in Styled(div)
in Unknown
in Unknown (created by SizeMeRenderer(Component))
in SizeMeReferenceWrapper (created by SizeMeRenderer(Component))
in SizeMeRenderer(Component) (created by SizeMe(Component))
in SizeMe(Component)
in ThemeProvider
in Unknown (created by ManagerConsumer)
in ManagerConsumer (created by Manager)
in EffectOnMount (created by Manager)
in Manager (created by Context.Consumer)
in Location (created by QueryLocation)
in QueryLocation (created by Root)
in LocationProvider (created by Root)
in HelmetProvider (created by Root)
in Root
重现方法
运行命令:npx sb@next repro
将 main.js 中的 "@storybook/addon-essentials" 替换为
"@storybook/addon-docs",
"@storybook/addon-controls",
"@storybook/addon-actions",
在 Button Story 的参数中添加 controls: {disable: true}
重新加载 Button story 页面并查看浏览器控制台。
系统环境
System:
OS: macOS 11.4
CPU: (8) arm64 Apple M1
Binaries:
Node: 16.0.0 - ~/.nvm/versions/node/v16.0.0/bin/node
Yarn: 2.4.2 - ~/.nvm/versions/node/v16.0.0/bin/yarn
npm: 7.13.0 - ~/.nvm/versions/node/v16.0.0/bin/npm
Browsers:
Chrome: 91.0.4472.114
Safari: 14.1.1
npmPackages:
@storybook/addon-actions: ^6.4.0-alpha.11 => 6.4.0-alpha.11
@storybook/addon-docs: ^6.4.0-alpha.11 => 6.4.0-alpha.11
@storybook/addon-essentials: ^6.4.0-alpha.11 => 6.4.0-alpha.11
@storybook/addon-links: ^6.4.0-alpha.11 => 6.4.0-alpha.11
@storybook/node-logger: ^6.4.0-alpha.11 => 6.4.0-alpha.11
@storybook/preset-create-react-app: ^3.1.7 => 3.1.7
@storybook/react: ^6.4.0-alpha.11 => 6.4.0-alpha.11
额外背景信息
只有在导入 "@storybook/addon-docs", "@storybook/addon-controls" 和 "@storybook/addon-actions" 而不是 "@storybook/addon-essentials" 时,我才能重现这个bug。因此,只需导入 "@storybook/addon-essentials" 就可以作为解决方法。
5条答案
按热度按时间mbzjlibv1#
我仅使用
@storybook/addon-essentials
,仍然看到错误。运行Storybook 6.3.6。错误:
sxissh062#
对于我来说,这仍然是一个问题。
kcugc4gi3#
看起来 $x_{
@storybook/addon-actions
}$ 是导致问题的原因。如果我从 $x_{addons-essentials
}$ 插件中禁用它,它就不会再抛出这个错误。$x_{
}$
9wbgstp74#
我在使用Storybook 6.5.14时遇到了相同的问题,
controls: {disable: true}
在@storybook/addon-essentials
上。@orlando的修复方法虽然有效,但并不实用,因为这个操作是全局禁用的。
e5nqia275#
遇到同样的问题(
Storybook-html 6.5.14
和@storybook/addon-essentials
)。尽管可以为单独的故事禁用操作,但全局禁用操作。只需将options: { actions: false }
添加到您的故事参数中:cc @Cedric-ruiu