How can I make a check in input value (React)

user_12637563 0
Viewed 74

I have and custom input that I use in my project. And I want to make check on input value before put it in props. I put in input value number which I get from mapping array. I want to make a check like if arrVal !== 0 put arrVal else put 1

{arr.map((it, i) => (
    <Input
        value={it.num} // here make a check like it.num !== 0 ? it.num : 1
    />
))}
react-props reactjs javascript
3 Answers

You could pass the conditional Statement to the value, like this:

{arr.map((it, i) => (
   <Input
      value={it.num !== 0 ? it.num : 1}
   />
))}

or if the condition is more complicated you can store the result on a variable then use it, like this:

{arr.map((it, i) => {
   const result = it.num !== 0 ? it.num : 1;
   
   return (
      <Input value={result} />
   )})
}
user_65144480

You can use a guard clause with fallback value:

{arr.map((it, i) => (
  <Input key={i} value={(it && it.num) || 1} />
))}

Or use Optional Chaining with fallback value:

{arr.map((it, i) => (
  <Input key={i} value={it?.num || 1} />
))}

Don't forget the React key for the mapped elements.

user_86908570

Just add this value={it.num || 1}

{arr.map((it, i) => (
    <Input
        value={it.num || 1} 
    />
))}
user_59390580
Related