javascript - Typescript React/Redux 指南 - 如何从 js 翻译？

Question

我正在翻译这个guide 。这是我迄今为止翻译的代码(在 Todo.tsx 中):

import * as React from 'react'
import * as PropTypes from 'react';

interface ITodo
{
  onClick : ()=>void,
  completed : boolean,
  text : string
}
​
const Todo = ({ onClick, completed, text } : ITodo) => (
  <li
    onClick={onClick}
    style={ {
      textDecoration: completed ? 'line-through' : 'none'
    }}
  >
    {text}
  </li>
)

但是我在第二部分(在 js 中:)中遇到了困难

Todo.propTypes = {
  onClick: PropTypes.func.isRequired,
  completed: PropTypes.bool.isRequired,
  text: PropTypes.string.isRequired
}

因为 PropTypes 似乎不包含任何 bool 或 func 或 string 成员。

Answer 1

首先，几乎没有理由将 PropTypes 与 TypeScript 一起使用。

其次，您可能需要考虑启用 allowSyntheticDefaultImports 或最近添加的内容，我将其名称转义到您的 tsconfig.json 中，这样您就可以避免 导入*为。

第三，您应该将 SFC 定义为 React.SFC，而不是在参数中断言预期的 props。如下:

const Todo: React.SFC<ITodo> = (props) => ();

您当然可以像以前一样解构并使用 JSX。