storybook [Bug]:在初始加载时,useParameter API不起作用,

pjngdqdw  于 6个月前  发布在  其他
关注(0)|答案(3)|浏览(56)

描述bug

useParameter API在初始加载时无法正常工作。
我正在实现和管理一个storybook-addon-cookie
我的插件使用useParameter来读取用户在故事中输入的cookie值,并在面板中显示它们。
然而,自从迁移到storybook版本8后,当我通过useParameter访问参数时,我在初始加载时得到一个空值。
当我使用console.logpreviewPanel时,它似乎在调用preview之前一直得到一个空值。
有没有办法确保在调用manager.js之前调用preview.js?

// Panel
export const PanelContent: React.FC = () => {
  const { path } = useStorybookState();
  const defaultCookie = useParameter<Cookie>(PARAM_KEY, {}); // TODO: Doesn't work on initial load

  const [story, setStory] = useState<string>();
  const [value, setValue] = useState<Cookie>();
  const [globals, updateGlobals] = useGlobals();

  const initCookie = () => {
    setStory(path);
    setValue(defaultCookie);
    clearCookies();
    setCookies(defaultCookie, encoding);
  };

  useEffect(() => {
    console.log('defaultCookie', defaultCookie);
    if (story !== path) {
      initCookie();
    }
  }, [defaultCookie, path, story]);
 //...
}
// preview
export const cookieDecorator = (
  storyFn: StoryFunction<Renderer>,
  { parameters }: DecoratorContext,
) => {
  const [flag, setFlag] = useState<boolean>(true);

  if (flag) {
    setFlag(false);
    if (!parameters) return storyFn();

    if (parameters[PARAM_PRESERVE_KEY] !== true) {
      clearCookies();
    }

    if (parameters[PARAM_KEY]) {
      console.log(parameters[PARAM_KEY]);
      setCookies(parameters.cookie, parameters.cookieEncoding);
    }
  }

  return storyFn();
};

复现链接

https://github.com/hwookim/storybook-addon-cookie

复现步骤

  • 无响应*

系统

该包基本上遵循了addon-kit中的设置。

其他上下文

  • 无响应*
xdyibdwo

xdyibdwo1#

@ndelangen 有任何想法吗?

wz3gfoph

wz3gfoph2#

是否有办法确保在调用 manager.js 之前先调用 preview.js ?
很遗憾,没有。
这是因为参数是动态的,故事是异步加载的;只有在故事加载完成后,管理器才能知道关于某个故事的参数。

ego6inou

ego6inou3#

@ndelangen 是否有API可以判断参数是否已加载?
很难通过值的存在或缺失来判断,因为用户可以发送一个空值。

相关问题