小编nca*_*eln的帖子

我正在尝试使用 TS 来试验自定义 Hooks（两者都很新）。这useOption应该采用 anumber或 a boolean，并返回value具有相同类型的 和更改器函数。这是因为选项应该是<input>“范围”类型，并且一个<input>选项应该是复选框（但这可以使用其他输入类型进行扩展）。所以我有一个<Options />这样的组件：

const Options = () => {
  const [pieces, setPieces] = useOption(10);
  const [speed, setSpeed] = useOption(5);
  const [sound, setSound] = useOption(false);

  return (
    <div className='Options'>
      <input
        type='range'
        value={pieces}
        onChange={setPieces}
        min='5'
        max='25' />
      <p>{pieces}</p>
      <input
        type='range'
        value={speed}
        onChange={setSpeed}
        min='1'
        max='10' />
      <p>{speed}</p>
      <input
        type='checkbox'
        value={sound}
        onChange={setSound} />
      <p>{sound ? 'Sound on' : 'Sound off'}</p>
      <button
        className='start-btn'
        onClick={handleClick}>Start game</button>
    </div> …