Блог

Вот как выглядят мои данные (ответы клиентов) :

 [{"id":1,"description":"CORPORATE","en":"Corprorate","gr":"Εταιρία","type":"ASSET"},{"id":2,"description":null,"en":"Property","gr":"Περιουσίας","type":"ASSET"}]
 

У меня есть следующий фрагмент кода:

 //populate data
      fetchAllLos() {
        let that = this;
        this.props.losStore.getAllLos().then(function (clientsResponse) {
          that.setState({ data: [clientsResponse] })
        }).catch(function (error) {
          console.log(error.message);
        });

      }
.....
render(){
.......
             <FormItem>{getFieldDecorator('antd',
                { initialValue: "PROPERTY" },
                { }] })(<Select
                  showSearch style={{ width: 200 }} 
                  onChange={this.handleChangeLineOfBusiness}>
                  {this.state.data.filter((los)=> los.type !=="ASSET" amp;amp;
                          <Option key={los.id} value={los.id}>{los.id}</Option>)}

                </Select>)}
              </FormItem>
.....
 

Вызывает следующую ошибку в браузере :

 Error: Objects are not valid as a React child (found: object with keys {id, description, en, gr, type}). If you meant to render a collection of children, use an array instead.
    in Select (created by Context.Consumer)
 

Что я делаю не так?

Замените свой this.state.data.filter на-

 this.state.data.filter(los => los.type !== 'ASSET').map(option => (
    <Option key={option.id} value={option.id}>{option.id}</Option>
));
 

Кроме того, поскольку clientResponse это уже массив, сделайте это так-

 this.setState({data: clientResponse})