小编Dan*_*pos的帖子

我正在尝试进行设置，以便当我在Person组件的输入中键入名称时，App组件中的状态会被更新，进而更新Person中prop的值，但是看起来状态正在发生变化，但是道具没有更新，有人可以帮我找出问题所在吗？

应用程式

const App = () => {
  const [persons, setPersons] = useState([
    {id: "key1", name: "Daniel", age: "28"},
    {id: "key2", name: "John", age: "30"},
    {id: "key3", name: "Doe", age: "60"}
  ]);

  const nameChangedHandler = (id, event) => {
    console.log(event.target.value);
    console.log(id);
    const personIndex = persons.findIndex(p => {
      return p.id === id;
    });

    const person = {
      ...persons[personIndex]
    };

    person.name = event.target.value;

    const pers = [...persons];
    persons[personIndex] = person;

    setPersons(pers);
    console.log(persons);
  };

  let people = persons.map((person, index) => {
    return ( …

我试图在点击时打开特定标记上的信息窗口,但是当我点击一个时,它会显示所有这些都打开了,并显示我这个错误: React.Children.only expected to receive a single React element child.

这就是我的代码现在的样子:

import React, { Component } from 'react';
import {  GoogleMap, Marker, withGoogleMap, withScriptjs, InfoWindow } from 'react-google-maps'

class Map extends Component {
  state = {
    isOpen: false
  }

  handleMarkerClick = () => {
    this.setState({ isOpen: true})
  }

  render() {
    return(
    <div>
      <GoogleMap
        defaultZoom={13}
        defaultCenter={{ lat: -22.9034778, lng: -43.1264636 }}
      >{this.props.markers.map((marker, index) =>(
        <Marker
          key={index}
          position={marker.location}
          onClick={this.handleMarkerClick}
         >{this.state.isOpen && <InfoWindow onCloseClick={this.handleMarkerClick}/>}
       </Marker>
      ))}
      </GoogleMap>
    </div>
    )
  }
}

export default …