javascript - React 无法使用 (props)=> 访问类外的 Prop 值

Question

我试图让 GoogleMapGazi 使用“props=>”访问我的类 GoogleMaps 的 Prop ，但我做不到。我已经通过父组件将 lat 和 lng Prop 传递给了类。这是我的代码，任何帮助都会很棒!

const GoogleMapGazi = withGoogleMap(props => (
  <GoogleMap
    defaultCenter={{ lat: 25.804281, lng: -80.1903893 }}
    defaultZoom={15}
  >
    <Marker position={{ lat: props.lat, lng: props.lng }} />
  </GoogleMap>
));

class GoogleMaps extends Component {
  render() {
    return (
      <div>
        <GoogleMapGazi
          containerElement={<div style={{ height: `500px`, width: "600px" }} />}
          mapElement={<div style={{ height: `100%` }} />}
        />
      </div>
    );
  }
}

export default GoogleMaps;

Answer 1

您必须从 GoogleMaps 组件传递 Prop 。

您可以显式传递 lat 和 lng 属性，或者您可以使用扩展语法传递所有属性。

class GoogleMaps extends Component {
  render() {
    return (
      <div>
        <GoogleMapGazi
          containerElement={<div style={{ height: `500px`, width: "600px" }} />}
          mapElement={<div style={{ height: `100%` }} />}
          {...this.props}
        />
      </div>
    );
  }
}