Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

select 组件通过 props 传入数据数据遍历 Option 时报错 #3389

Closed
zhangchen2397 opened this issue Oct 12, 2016 · 3 comments
Closed

Comments

@zhangchen2397
Copy link

antd 版本: 2.0.0
操作系统及其版本: OS X 10.11.6
浏览器及其版本: chrome 53.0.2785.116

基本代码如下:

<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>

通过 this.props.options.map 遍历 Option 时,报错

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

报错位置在 Select.js 中 400行

_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);
  }
});

如果是直接写死成 Option 则没有问题

<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>
@RaoHai
Copy link
Contributor

RaoHai commented Oct 12, 2016

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

or

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

@zhangchen2397
Copy link
Author

ths @RaoHai
soga

@RaoHai RaoHai closed this as completed Oct 12, 2016
@lock
Copy link

lock bot commented May 3, 2018

This thread has been automatically locked because it has not had recent activity. Please open a new issue for related bugs and link to relevant comments in this thread.

@lock lock bot locked as resolved and limited conversation to collaborators May 3, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants