React无法使用选项元素读取未定义的属性“值”

时间:2019-04-03 23:08:47

标签: javascript arrays reactjs jsx

我有一个看起来像这样的数组。

OrchardSite > Array(16) > 0: {blocks: Array (3), name: "asdasd", code: "R101A"}
                          1: {blocks: Array (7), name: "dasdas", code: "R555"}

每个站点都有不同数量的块,当我选择一个站点时,我想查看选定的值,例如,如果我选择R101A,则它应该只有3个块,这将在以后实现。现在,我什至无法读取所选元素的值,这是我需要的帮助。

setOrchard = (event) => {
  const orchardId = event.target.value;
  console.log("orchardID", orchardId)
   if (orchardId.length > 0) {
      if (!this.props.metadata.OrchardSites[parseInt(orchardId)].blocks) 
          this.props.metadata.orchardSites[parseInt(orchardId)].blocks = []
            console.log("SetttingOrchardLocation", this.props.metadata.orchardSites)
            this.setState({ orchardId: orchardId, block: null, area: null, row: null, site: Object.assign({}, this.props.metadata.orchardSites[parseInt(orchardId)]) })
            console.log("Testing OrchardId", this.props.metadata.orchardSites[parseInt(orchardId)])
        // parseInt to get access to the array index, (Maybe I need to .ToString() somewhere?
    }
}

在我的渲染中,我有这个。

const orchardId: string = (this.state as any).orchardId.toString()

我的JSX看起来像这样

<select className="input-field-slider dropdown w-select" onChange={() => this.setOrchard(orchardId)}>
<option>All Sites</option>
{orchardSites
    .map((orchardSite, i) => (
        <option key={i} value={orchardSite.code}>
            {orchardSite.code + " " + orchardSite.name}
        </option>
    ))}

每次我更改下拉菜单中的选项时,函数都会触发并为我提供更新的Orchard,反正就是这样。

  

未捕获的TypeError:无法读取未定义的属性“值”

每次我更改选项时,我都会受到欢迎。

0 个答案:

没有答案