在StoryBook文档中使用propTypes的ArgsTable

编程问答 2022-06-09

问题描述

我正在尝试为一个小型组件创建文档。为此，我将StoryBook与附件“ @ storybook / addon-docs”配合使用，但无法显示组件属性。

我的组件： 

function OverlayList(props) {...}

OverlayList.propTypes = {
  /**
   * Prop children.....Example 1.
   **/
  children: PropTypes.element.isrequired,/**
   * Test .... .
   */
  options: PropTypes.array,/**
    Test test test
    */
  selectedValue: PropTypes.string,};

OverlayList.defaultProps = {
  children: <input></input>,options: [],};

export default OverlayList;

src / components / OverlayList / OverlayList.stories.js 

import React from 'react';
import OverlayList from './OverlayList';

export default {
  title: 'OverlayList',component: OverlayList,};

export const overlayList = (args) => {
  return <OverlayList {...args} />;
};

.storybook / main.js 

module.exports = {
  stories: ['../src/components/**/*.stories.[tj]s'],addons: ['@storybook/addon-docs'],};

为什么我看不到组件道具及其描述？

该组件不是使用“ create-react-app”创建的，我使用的是webpack。

enter image description here

非常感谢您所做的一切。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

documentationreactjsreactjsstorybookwebpackwebpackwebpack