for循环仅返回reactJS中的初始索引

Question

我是React JS的新手，所以在我的练习中，我正在创建一个动态的birtdate形式。我的第一个挑战是从出生年份的1900年到今年（2017年）的年份列出，所以我使用for循环来缩短它，而不是一个一个地列出年份的可怕方式在标记中。下面的代码没有成功执行，只返回2017年。

export default class Items extends Component {
  render() {
    return(
      <div>
        <form>
          <select name='year' className='yearSelect'>
            <option value="">Year</option>
            {
              for(let yearCount = 2017; yearCount >= 1900; yearCount--)
                return <option value={yearCount}>{yearCount}</option>
            }
          </select>
        </form>
      </div>
    );
  }
}

在控制台中，它抛出了一个错误：

这是因为范围而困扰我的花括号所以我不得不删除for循环的花括号并缩进其中的行。

Answer 1

更新您的代码，如下所示。

export default class Items extends Component {
  render() {
       let options = [];
         for(let yearCount = 2017; yearCount >= 1900; yearCount--)
             options.push((<option value={yearCount} key={yearCount}>{yearCount}</option>));
    return(
      <div>
        <form>
          <select name='year' className='yearSelect'>
            <option value="">Year</option>
            { options }
          </select>
        </form>
      </div>
    );
  }
}