If clause in JSX map function-CodePudding

So i have this code to generate multiple dropdown lists.

<div>
  {['Mischung', 'Menge'].map((key) => (
    <select key={key}>
      {mischung.map(({ [key]: value }) => (
        <option key={value}>{value}</option>
      ))}
    </select>
  ))}
</div>

Every dropdown list is beeing generated, but with empty values.

As you can see there are empty values from the other dropdown.

How can i check the value for null or if its not empty.

CodePudding user response：

<div>
  {['Mischung', 'Menge'].map((key) => (
    <select key={key}>
      {mischung.map(({ [key]: value }) => {
        if (value) {
          return (
            <option key={value}>{value}</option>
          )}
        }
      )}
    </select>
  ))}
</div>