如何修复错误:“未定义项目'...”

时间:2018-12-23 19:50:18

标签: javascript reactjs

它假设返回组件通过获取字符串数组来实现下拉列表。如何使用数组元素可能是个错误。

import React from 'react'

class DropDownList extends React.Component {
  renderDropDownList = () => {
    const { dropDownDownData } = this.props
    return (
       <div className="book-shelf-changer">
       <select>
          dropDownDownData.map(function(item){
            <option key = {item} value={item}>{item}</option>
          })
        </select>
      </div>
    )

  }
  render() {
    const optionList  = ['Move to...','Currently Reading','Want to Read','Read','None']
    return this.renderDropDownList(optionList)
  }
}

export  { DropDownList }

1 个答案:

答案 0 :(得分:1)

我认为这仅仅是因为您忘记了一些花括号来调用dropDownData函数,而您的函数并未被解释为Javascript函数。还要在地图函数中添加返回值。

它应与此:

<select>
   {dropDownDownData.map(function(item){
      return (<option key = {item} value={item}>{item}</option>);
   })}
 </select>

您还可以将ES6语法用于地图表达式:

 <select>
   {dropDownDownData.map(item => (<option key = {item} value={item}>{item}</option>))}
 </select>