使用 array.map 在 React 中列出在 IE10 中不起作用

Question

渲染功能我有这样的代码：

render () {
  return (
    <div className='s-with-fancy-arrow'>
    <select className='city' onChange={this.change} value={this.state.selected}>
    {
      this.state.cities.map(function (city, index) {
        return <option key={'city-list-' + index} value={city.id}>{city.display_name}</option>
      })
    }
    </select>
    </div>
    );
}

在 Internet Explorer 10 中，它只像 div 中的 select 一样呈现，select 中没有任何选项。

如何解决这个问题？

Answer 1

这样试试

this.state.cities.map(function (city, index) {
        return (<option key={'city-list-' + index} value={city.id}>{city.display_name}</option>)
      })

而不是这个

this.state.cities.map(function (city, index) {
        return <option key={'city-list-' + index} value={city.id}>{city.display_name}</option>
      })

Answer 2

在代码中苦苦搜索后，我们发现了一个简单的原因：在没有 polifills 的情况下使用 fetch 和 promise。

使用 array.map 在 React 中列出在 IE10 中不起作用

Listing in React using array.map does not working in IE10

javascript

jsx

internet-explorer-10

reactjs