时间戳

首页 > 解决方案 > 如何将 useState 方法传递给组件并且该组件返回状态？

reactjs - 如何将 useState 方法传递给组件并且该组件返回状态？

问题描述

我的 Home.js 文件有：

  const [location, setLocation] = useState({});

<Search setLocation={{ setLocation }} />

在我的 Search.js 文件中，我有：

const Search = (setLocation) => (
  <Container>
    <GooglePlacesAutocomplete
      placeholder="Onde você esta?"
      onPress={(data, details) => {
        setLocation(data, details.geometry.location);
      }}

some code...

我收到此错误：setLocation 不是函数。setLocation 是对象的一个​​实例

如何更改位置状态？

标签： reactjsreact-nativereact-hooks

解决方案

您将方法发送到对象中的搜索组件的第一件事。所以你得到了这个

error: setLocation is not a function. setLocation is an instance of object

您正在尝试执行嵌套对象 {{setLocation}} onPress GooglePlace。

发送方法作为这样的道具

<Search setLocation={setLocation} />

比你在这样的搜索组件中获得 setLocation 作为对象

{setLocation}

以这种方式更改您的搜索组件

const Search = ({setLocation}) => (
  <Container>
    <GooglePlacesAutocomplete
      placeholder="Onde você esta?"
      onPress={(data, details) => {
        setLocation(data, details.geometry.location);
      }}
     />
</Container>
)

推荐阅读