使用for循環的反應構建選擇輸入

我正在嘗試構建一個選擇下拉列表並使用for循環填充輸入字段。使用for循環的反應構建選擇輸入

import React, { Component } from 'react'; 

export default class Test extends Component { 
    render() { 
    let options = []; 
    for (let i=2; i < 20.5; i += 0.5){ 
     options.push(<option value={i*60} key={i}>{i} hours</option>) 
    } 
    return (
     <select> 
     {options} 
     </select> 
    ) 
    } 
}

的{i} hours部使一個Uncaught TypeError: Cannot read property 'props' of undefined錯誤消息。將其更改爲固定字符串可防止出現錯誤。

我敢肯定我錯過了一些基本的東西，但我不知道爲什麼這不起作用。

來源

2016-03-01 user5633550

工作對我來說，通常不確定問題的「道具」是帶有這種結合 - 有更多的代碼的地方？ –

我以爲它可能是其他代碼，但我做了這個測試組件，並使用下面的代碼直接將其呈現給頁面，它仍然發生： ReactDOM.render（React.createElement（Test），document.querySelector（'。反應容器'））; – user5633550

Jsfiddle會幫助:) –

試試這個：

import React, { Component } from 'react'; 

export default class Test extends Component { 
    render() { 
    let options = []; 
    for (let i=2; i < 20.5; i += 0.5) { options.push(i); } 
    return (
     <select> 
     {options.map((i) => { 
      return (<option value={i*60} key={i}>{i} hours</option>) 
     })} 
     </select> 
    ) 
    } 
}

來源

2017-03-08 13:36:48

使用for循環的反應構建選擇輸入

回答

相關問題