Question

反应-16.8.6
React-dom-16.8.6
Next.js-8.1.0

因此，我正在升级一些兼容Hook的旧代码，并想知道如何使用等效的Hook实现以下目标：

<Mutation mutation={UPDATE_ITEM_MUTATION} variables={this.state}>
  <form />
</Mutation

其中this.state是所有保留的表单数据的总和。

Answer 1

我必须从很少的信息中识别出很多东西。我假设您想使用implicit class AsSetOps[F, A](val fa: scala.collection.SeqLike[A, F]) { def asSet: Set[A] = fa.toSet[A] } Seq(1,2,3).asSet.map(_ * 2)之类的React钩子，而不是引用toSet和useState()。

假设您有类似的东西

this.state

您需要

将类组件转换为功能组件。
初始化状态，并使用setState检索状态作为本地值。
import React from 'react' class WrappingComponent extends React.Component { state = {value1: '', value2: 0} render() { return ( <Mutation mutation={UPDATE_ITEM_MUTATION} variables={this.state}> <form /> </Mutation> ) } }还返回一个setter，该setter代替该特定状态元素的useState()。

useState()

Answer 2

所以，我一直在寻找的是

  const [state, setState] = useState({
    value1: '',
    value2: '',
    value3: 0,
    ...
  });

 const handleValueChange = (e) => setState({ ...state, value1: e.target.value });
 ...
 <Mutation mutation={UPDATE_ITEM_MUTATION} variables={state}>

挂钩：如何获取全局状态（this.state）？

2 个答案: