Ant-design: Wenn die select-Komponente Daten durch Requisiten durchläuft, durchläuft sie die Option und meldet einen Fehler

Erstellt am 12. Okt. 2016  ·  3Kommentare  ·  Quelle: ant-design/ant-design

Antd-Version: 2.0.0
Betriebssystem und seine Version: OS X 10.11.6
Browser und seine Version: chrome 53.0.2785.116

Der grundlegende Code lautet wie folgt:

<FormItem
  label="选择业务"
  labelCol={{ span: 6 }}
  wrapperCol={{ span: 14 }}
>
  {getFieldDecorator('bid', { initialValue: "1" })(
    <Select 
      size="large" 
      style={{ width: 150 }}
      onChange={this.handleSelectChange.bind(this)}
    >
      {
        this.props.options.map((item, index) => {
          <Option key={index} value={item.id}>{item.name}</Option>
        })
      }
    </Select>
  )}
</FormItem>

Beim Durchlaufen Option this.props.options.map Fehler gemeldet

Select.js:400 Uncaught TypeError: Cannot read property 'type' of null

Der Fehler wird in Zeile 400 in Select.js gemeldet

_react2["default"].Children.forEach(children, function (child) {
  if (child.type === _OptGroup2["default"]) {
    var maybe = _this2.getLabelBySingleValue(child.props.children, value);
    if (maybe !== null) {
      label = maybe;
    }
  } else if ((0, _util.getValuePropValue)(child) === value) {
    label = _this2.getLabelFromOption(child);
  }
});

Wenn es direkt als Option geschrieben wird, gibt es kein Problem

<FormItem
  label="选择业务"
  labelCol={{ span: 6 }}
  wrapperCol={{ span: 14 }}
>
  {getFieldDecorator('bid', { initialValue: "1" })(
    <Select 
      size="large" 
      style={{ width: 150 }}
      onChange={this.handleSelectChange.bind(this)}
    >
      <Option value="1">option1</Option>
      <Option value="2">option2</Option>
    </Select>
  )}
</FormItem>

Hilfreichster Kommentar

this.props.options.map((item, index) => {
    return <Option key={index} value={item.id}>{item.name}</Option>
})

oder

this.props.options.map((item, index) => <Option key={index} value={item.id}>{item.name}</Option>)

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions

Alle 3 Kommentare

this.props.options.map((item, index) => {
    return <Option key={index} value={item.id}>{item.name}</Option>
})

oder

this.props.options.map((item, index) => <Option key={index} value={item.id}>{item.name}</Option>)

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Functions/Arrow_functions

ths @RaoHai
Soga

Dieser Thread wurde automatisch gesperrt, da er in letzter Zeit nicht aktiv war. Bitte öffnen Sie ein neues Problem für verwandte Fehler und verlinken Sie auf relevante Kommentare in diesem Thread.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen