反应Uncaught TypeError：无法读取null的属性“ props”

Question

我得到了

  

“ TypeError：无法读取未定义的属性'setState'”

当我从包含googlemap的页面转到另一个页面时

const MapComponent = compose(
    withProps({
         googleMapURL: "https://maps.googleapis.com/maps/api/js?key=AIzaSyAoa373lwAsdouzumRvpxb7Vdw5IPLhacQ&v=3.exp&libraries=geometry,drawing,places",
         loadingElement: <div style={{ height: `100%` }} />,
         containerElement: <div style={{ height: `100%` ,display: `flex`,flexDirection: `row`,width: `100%` }} />,
        mapElement: <div style={{ height: `100%`,width:`80%` }} />,
     }),
     withScriptjs,
     withGoogleMap,
     withState('places', 'updatePlaces', ''),
     withHandlers(() => {
         const refs = {
             map: undefined,
             lat:0,
             lng:0
         }
         return {
             onMapMounted: () => ref => {
                 refs.map = ref;
                 refs.lat=ref.props.defaultCenter.lat;
                 refs.lng=ref.props.defaultCenter.lng;
             },
             fetchPlaces: ({ updatePlaces }) => () => {
                 const center = new google.maps.LatLng(refs.lat,refs.lng);
                 const bounds = refs.map.getBounds();
                 const service = new google.maps.places.PlacesService(refs.map.context.__SECRET_MAP_DO_NOT_USE_OR_YOU_WILL_BE_FIRED);
                 const request = {
                     bounds: bounds,
                     location: center,
                     radius:7000,
                     type:['library']
                 };
                 service.nearbySearch(request, (results, status) => {
                     if (status === google.maps.places.PlacesServiceStatus.OK) {
                         refs.isLoadedAllLibraries=true;
                         updatePlaces(results);
                     }
                 })
             }
         }
     }),
 )((props) => {
     return (
         <div className='p-3' style={{maxHeight:`600px`,overflow :`auto`,maxWidth: `300px`}}> {props.places &&  props.places.map((place, i) => {
             return ( <div className='flex flex-row items-center' style={{cursor:`pointer`}} onClick={()=>{props.onMarkerClick(place)}}>
                         <img src='https://maps.google.com/mapfiles/kml/shapes/library_maps.png' alt="Library icon" width='32px' height='32px'/>
                         <div className='p-2'>
                             <h3>{place.name}</h3>
                             <hr />
                             <h4>Address: {place.vicinity}</h4>
                         </div>
                 </div>)})}
         <GoogleMap
             onTilesLoaded={props.fetchPlaces}
             ref={props.onMapMounted}
             onBoundsChanged={props.fetchPlaces}
             defaultZoom={12}
             defaultCenter={{
               lat: props.currentLocation.lat,
               lng:  props.currentLocation.lng
             }}
         >{props.directions && <DirectionsRenderer directions={props.directions} />}
             <Marker
             position={{ lat: props.currentLocation.lat, lng: props.currentLocation.lng }}
             options={{icon:'https://png.icons8.com/color/50/000000/street-view.png'}}
             onClick={()=>{
                 props.onMarkerClick("userMarkerClick");
             }}
         >
             {props.currentUserInfoBoxIsOpen && (
                 <InfoWindow onCloseClick={()=>{props.onInfoWindowClose("userMarkerClick")}}>
                     <div>
                         <h5>You are here</h5>
                     </div>
                 </InfoWindow>)
             }
         </Marker>
             {props.places && props.places.map((place, i) => {
                 return ( <Marker
                                key={i}
                                position={{ lat: place.geometry.location.lat(), lng: place.geometry.location.lng() }}
                                options={{ icon:'https://maps.google.com/mapfiles/kml/shapes/library_maps.png'}}
                                onClick={()=>{props.onMarkerClick(place)}}
                 >
                 {props.isInfoBoxOpen && props.activeMarker===place && (
                     <InfoWindow onCloseClick={()=>{props.onInfoWindowClose("")}}>
                         <div>
                             <h3>Library Name: {place.name}</h3>
                             <hr />
                             <h4>Address: {place.vicinity}</h4>
                             <a href="" onClick={(e)=>{
                                 e.preventDefault();
                                 e.stopPropagation();
                                 props.getDirections(place)
                             }}>Get Directions</a>
                         </div>
                     </InfoWindow>)}
                 </Marker>)})}
         </GoogleMap>
         </div>
     )
 });

 export default MapComponent;