reactjs - React Typescript Storybook - 字符串文字类型

Question

我想String literal types在我的组件中使用，并且我希望能够使用 Storybook 在我的故事中选择任何这些字符串。

该组件只能接收 3 种类型的字符串：LATER| IMMEDIATELY|FCFS

但是，我有这个错误：

Type 'string' is not assignable to type '"LATER" | "INMEDIATELY" | "FCFS"'.ts(2322) index.tsx(4, 3): The expected type comes from property 'type' which is declared here on type 'IntrinsicAttributes & LotteryCardInterface & { children?: ReactNode; }'

零件：

interface LotteryCardInterface {
  type: 'LATER' | 'INMEDIATELY' | 'FCFS'
}

const LotteryCard: React.FC<LotteryCardInterface> = (props: LotteryCardInterface) => 
(<p>
    {props.type}
  </p>)

export default LotteryCard;

故事：

export default {
  title: 'organism|LotteryCard',
  component: LotteryCard,
  decorators: [withKnobs]
}

const label = 'type';
const options = {
  LATER: 'LATER',
  INMEDIATELY: 'INMEDIATELY',
  FCPS: 'FCPS',
};
const defaultValue = 'LATER';

export const Summary = () => {
  const value = radios(label, options, defaultValue);
  return (
    <LotteryCard
      type={value}
    />
  )
}

知道如何解决吗？

谢谢

标签： reactjstypescriptstorybook