this.state.hiring.map(h => (
  <FormApp
    condType={h.type}
    condRef={h.ref}
    label={h.name}
    labelName={h.name}
    name={h.id}
    id={h.name}
    validations={h.required == true ? [this.required] : null}
    dataList={this.state[h.ref]}
    onChange={this.onChangeInput}
  />
));

I want to if (h.requered == true) { return [this.required] } else { null }

I have problem

react js : TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))

this.state.hiring.map(h => (
  <FormApp
    condType={h.type}
    condRef={h.ref}
    label={h.name}
    labelName={h.name}
    name={h.id}
    id={h.name}
    validations={h.required == true ? [this.required] : null}
    dataList={this.state[h.ref]}
    onChange={this.onChangeInput}
  />
));

I want to if (h.requered == true) { return [this.required] } else { null }

I have problem

react js : TypeError: object null is not iterable (cannot read property Symbol(Symbol.iterator))

• javascript
• reactjs

• 1 It looks like validations expects to be passed an array, not null. So maybe pass an empty array instead of null? – Felix Kling Commented Mar 14, 2019 at 21:04
• 1 This.state.hiring is null, you can set the initial state of hiring to an empty array instead. – vitomadio Commented Mar 14, 2019 at 21:16
• What is this.state.hiring? Could you update the code? I bet you're getting error from this line, not validations, because it's the only iterating part in your snippet – flppv Commented Mar 15, 2019 at 1:12

1 Answer 1

Maybe you can modify your code like this:

const { hiring } = this.state;
hiring instanceof Array && hiring.map(h => { // ==> Validate hiring before use it.
        if (h.requered == true) {
            return (
                <FormApp
                    condType={h.type}
                    condRef={h.ref}
                    label={h.name}
                    labelName={h.name}
                    name={h.id}
                    id={h.name}
                    validations={h.required == true ? [this.required] : null}
                    dataList={this.state[h.ref]}
                    onChange={this.onChangeInput}
                />
            );
        } else {
            return null;
        }
    });