reactjs - React component errors undefined but should return null -


i'm trying component render , keep getting error a valid react element (or null) must returned. may have returned undefined, array or other invalid object. have no idea problem because i'm returning null if there's nothing return.

any thoughts?

component: companylogo

function companylogo(props) {   props.companies.map((company) => {     if (props.companyid == company._id) {       console.log("test see if firing");       return <p>return test</p>;     }     return null   }) } 

maximum number of jsx root nodes

from docs,

currently, in component's render, can return 1 node; if have, say, list of divs return, must wrap components within div, span or other component

function companylogo(props) {   props.companies.map((company) => {     if (props.companyid == company._id) {       console.log("test see if firing");       return (<p>return test</p>);     }     return (<p></p>)   }) } 

you can remove redundant return statement,

function companylogo(props) {      let component = <p></p>;     props.companies.map((company) => {         if (props.companyid == company._id) {             console.log("test see if firing");             component = <p>return test</p>;         }     });     return component; } 

Comments

Popular posts from this blog

python - Operations inside variables -

Generic Map Parameter java -

arrays - What causes a java.lang.ArrayIndexOutOfBoundsException and how do I prevent it? -