Javascript 物料UI菜单项是否自动将参数发送到onClick函数？

我有一个search.js文件和一个search-date.js文件。在search.js文件中，我呈现了一个

SearchDate

容器。我不理解的是

MenuItem

组件被单击时的行为

如您所见，函数

onDayChange

从

Search

传递到

SearchDate

。然后将此函数传递给

onClick

属性上的

MenuItem

<

Search

中的code>onDayChange需要一个

date

参数

现在，

警报

调用我已经输出：

对象

此对象来自何处？我在代码中的任何地方都看不到它是由我发送的。而且我不确定在材料UI文档中的何处查找

search.js：

import SearchDate from '../components/search-date';
import { modelInstance } from '../model/model';    

class Search extends Component {
  constructor(props){
    super(props)
    this.state = {
      data: null,
      searchSuggestion: 'Search for tweets here',
      anchorEl: null,
      date: 'Today',
      page: 0,
      placeName: 'the World'
    }

  componentDidMount() {
    modelInstance.addObserver(this);
  }

  handleClick = event => {
    this.setState({ anchorEl: event.currentTarget });
  };

  onDayChange = date => {
    alert(typeof date);
    this.setState({date: date})
    this.setState({ anchorEl: null });
  };



  render(){
    return(
        <div className='search'>
          <Row id='searchInput'>
            <SearchInput handleInput={this.handleInput.bind(this)} searchInput={this.state.searchInput} searchSuggestion={this.state.searchSuggestion} page={1}/>
          </Row>
          <Row>
            <SearchNav page={this.state.page}/>
          </Row>
          <Row id='date-location'>
            <Col xs={2} sm={2} md={2} className='text'>
              <p>FROM</p>
            </Col>
            <Col xs={4} sm={4} md={4} className='date'>
              <SearchDate date={this.state.date} anchorEl={this.state.anchorEl} click={this.handleClick} dayChange={this.onDayChange}/>
            </Col>
            <Col xs={2} sm={2} md={2} className='text'>
              <p>IN</p>
            </Col>
            <Col xs={4} sm={4} md={4} className='location'>
              <SearchLocation placeName = {this.state.placeName} handleLocation={this.handleLocation.bind(this)}/>
            </Col>

          </Row>
        </div>
    )
  }
}

export default Search;

从“../components/search date”导入SearchDate；
从“../model/model”导入{modelInstance}；
类搜索扩展组件{
建造师（道具）{
超级（道具）
此.state={
数据：空，
搜索建议：“在此处搜索推文”，
主持人：空，
日期：'今天'，
页码：0，
地名：“世界”
}
componentDidMount（）{
addObserver（this）；
}
handleClick=事件=>{
this.setState（{ancorel:event.currentTarget}）；
};
onDayChange=日期=>{
警报（日期类型）；
this.setState（{date:date}）
this.setState（{ancorel:null}）；
};
render（）{
返回(
从

在

)
}
}
导出默认搜索；

search-date.js：

const SearchDate = ({date, anchorEl, click, dayChange}) => {   
    return(
    <React.Fragment>
      <Button
        // variant="raised"
        aria-owns={anchorEl ? 'simple-menu' : null}
        aria-haspopup="true"
        onClick={click}
        margin={10}
      >
        {date}
      </Button>
      <Menu
        id="simple-menu"
        anchorEl={anchorEl}
        open={Boolean(anchorEl)}
        onClose={dayChange}
      >
        {/* {daysList} */}

        <MenuItem onClick={dayChange}>Yesterday</MenuItem>
        <MenuItem onClick={dayChange}>2 Days past</MenuItem>
        <MenuItem onClick={dayChange}>3 Days past</MenuItem>
        <MenuItem onClick={dayChange}>4 Days past</MenuItem>
        <MenuItem onClick={dayChange}>5 Days past</MenuItem>
        <MenuItem onClick={dayChange}>6 Days past</MenuItem>
        <MenuItem onClick={dayChange}>7 Days past</MenuItem>
      </Menu>
    </React.Fragment>
  );
}

export default withStyles(styles)(SearchDate);

const SearchDate=（{date，anchorEl，click，dayChange}）=>{
返回(
{date}
{/*{daysList}*/}
昨天
两天前
三天前
4天过去了
5天过去了
6天过去了
7天过去了
);
}
导出默认样式（样式）（SearchDate）；

材质UI将DOM事件作为onClick上的参数传递

onDayChange = (date) => (event) => { ...your code }

<MenuItem onClick={onDayChange('2 days past')}>2 Days past</MenuItem>

onDayChange=（日期）=>（事件）=>{…您的代码}
两天前

您可以在事件处理程序中传递您想要的任何内容。外部函数将在呈现时被调用。包含您的处理程序的内部函数将在单击菜单项时被调用。因此，例如，如果页面不在夜间刷新，您的日期参数可能会过时。就我个人而言，我会传递#of days作为参数，然后在处理程序中获取当前日期并在那里进行偏移