javascript - 不确定如何使此选项元素返回月份范围（*ngFor 角度等效于反应）

Question

我在这里有这个示例角度代码。它返回从一月到八月的月份范围

  months = [{month: 'Jan', value: '0'},
  {month: 'Feb', value: '1'},
  {month: 'Mar', value: '2'},
  {month: 'Apr', value: '3'},
  {month: 'May', value: '4'},
  {month: 'Jun', value: '5'},
  {month: 'Jul', value: '6'},
  {month: 'Aug', value: '7'}];

<div style="margin-left: auto">
  <select [(ngModel)]="from" style="width: 150px;height: 30px;">
    <option *ngFor="let m of months" [value]='m.value'>{{m.month}}</option>
  </select>
&nbsp;&nbsp;

<select [(ngModel)]="toMonth" style="width: 150px;height: 30px;">
  <option *ngFor="let m1 of months" [value]='m1.value'>{{m1.month}}</option>
</select>
</div> 

...有点像这样 我不确定如何在 React 中实现相同的功能...我在 React 中按如下方式实现...它返回错误：'months' is not defined

    <div>
  <select id="from">
     {
       months.map(el => <option value={el} key={el}> {el} 
       </option>)
     }
  </select>&nbsp;&nbsp;
  <select id="toMonth">
     {
       months.map(el => <option value={el} key={el}> {el} 
       </option>)
     }
  </select>&nbsp;&nbsp;     
</div> 

我将 props 中的月份定义为常数

标签： javascriptreactjs

Answer 1

将所有月份的迭代更改为 this.state.month.map(...) 并返回 {el.month}

<select id="from">
    {this.state.months.map((el) => (
      <option value={el.value} key={el}>
        {" "}
        {el.month}{" "}
      </option>
    ))}
</select>