Question

选择日期后，我想重新加载页面。我有一个叫做refreshmap的道具。

我是新手。

我想在onChange更改日期时触发函数（“刷新映射”）：

import React, { Component } from 'react';
import DateTimePicker from 'react-datetime-picker';
import MapLeaflet2 from './MapLeaflet2';


class Picker extends Component {
  state = {
    date: new Date(),
  }



  onChange = (date,refreshmap) => this.setState({date},
    function(){

      const DateContext =this.state.date;
      refreshmap()


    })

  render() {

    return (

      <div>
        <DateTimePicker
          onChange={(date) => this.onChange(date, this.refreshmap)} 
          value={this.state.date}
        />
         <MapLeaflet2 date = {this.state.date.toString()}/>


         )}         
      </div>
    );
  }
}

export default Picker;

我在这里收到此错误：

TypeError：refreshmap不是函数

作为示例，我在这里使用它作为按钮。效果很好。

import React from 'react';
import mapButtonStyles from './mapButtonStyles';

const RefreshButton = ({ refreshmap}) => (
  <button
    type="button"
    style={mapButtonStyles}
    className="map-button"
    onClick={refreshmap}
  >
    <i className="fas fa-sync-alt fa-2x" />
  </button>
);

export default RefreshButton;

它与按钮组件完美配合，但不适用于Picker。我收到错误消息TypeError：refreshmap不是函数

如前所述，我是新手，所以任何建议或观察都将非常有价值！

Answer 1

如果我正确理解了这个问题，那么您想在refreshmap的{{1}}事件中调用onChange函数。如果是这样，那么

DateTimePicker

在onChange={(date) => this.onChange(date, this.props.refreshmap)}中捕获refreshmap的引用并进行相应的调用。

onChange

如果我误解了这个问题，请告诉我。

希望有帮助。

Answer 2

我想您可以在onChange函数中触发refreshmap函数：

onChange = date => this.setState({date},
function(){
  const DateContext =this.state.date;
  this.props.refreshmap();
})

与：

<DateTimePicker
      onChange={this.onChange}
      value={this.state.date}
    />

进行编辑。从另一个组件触发函数：TypeError：refreshmap不是函数

2 个答案: