Реагировать JSX <option> тег население

Question

Я пытаюсь населён варианты тега со строковыми значениями из массива со следующей функцией:

render: function(){ 
    var array = ['yes','no']; 
    var opts = array.map(function(name){return <option>name</option>}); 
    return(
    <div> 
     <select>{opts}</select> 
    </div> 
    ); 
} 

Проблема в том, что я получаю

<option>name</option> 
<option>name</option> 

Но мне нужно

<option>yes</option> 
<option>no</option> 

Любые идеи, как это сделать?

Answer 1

Wrap name в {}

var App = React.createClass({ 
 
    render: function(){ 
 
    var array = ['yes','no']; 
 
    var opts = array.map(function(name){ 
 
     return <option>{ name }</option> 
 
    }); 
 
    
 
    return <div> 
 
     <select>{opts}</select> 
 
    </div> 
 
    } 
 
}); 
 

 
ReactDOM.render(<App />, document.getElementById('container'))

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> 
 
<div id="container"></div>