How to remove null values from props.map

Question

I'm maping from props to 'lawList', but the array contains alot of nullValues that i wish to prevent.

{props.map((lawList, index) => (
  <Table.Body key={index}>
    <Table.Row>
      <Table.Cell>{index + 1}</Table.Cell>
      <Table.Cell>{lawList.lawDTO.name}</Table.Cell>
      <Table.Cell>{lawList.text}</Table.Cell>
      <Table.Cell>{lawList.status}</Table.Cell>
      <Table.Cell>
        {new Date(lawList.latestRevisionDate).toISOString().substring(0, 10)}
      </Table.Cell>
      <Table.Cell>placeholder</Table.Cell>
    </Table.Row>
  </Table.Body>
))}

Any suggestions on how i can remove all null values from the 'lawList' ?

filter out all the null values before using map, like this: `props.filter(el => el).map(....)` — Mayank Shukla, Apr 15 '19 at 11:03
@MayankShukla my suggestion is to check for explicit values. `false`, empty string, 0 all are falsey. Also, it should be `!!` — Rajesh, Apr 15 '19 at 11:04
@Rajesh right, added reference of correct and proper solutions :) — Mayank Shukla, Apr 15 '19 at 11:15

score 2 · Answer 1 · answered Apr 15 '19 at 11:05

2

You can use filter(Boolean) on your array to filter out any falsy elements.

{props.lawList.filter(Boolean).map((lawList, index) => (
  <Table.Body key={index}>
    <Table.Row>
      <Table.Cell>{index + 1}</Table.Cell>
      <Table.Cell>{lawList.lawDTO.name}</Table.Cell>
      <Table.Cell>{lawList.text}</Table.Cell>
      <Table.Cell>{lawList.status}</Table.Cell>
      <Table.Cell>
        {new Date(lawList.latestRevisionDate).toISOString().substring(0, 10)}
      </Table.Cell>
      <Table.Cell>placeholder</Table.Cell>
    </Table.Row>
  </Table.Body>
))}

answered Apr 15 '19 at 11:05

Tholle

108,070
19
198
189

Stil gives me this error: https://gyazo.com/29e461ece009a48f6eaec5fefedc2feb – Arasto Apr 15 '19 at 11:10
when i add this {lawList.text.replace(/(<([^>]+)>)/ig,"")} – Arasto Apr 15 '19 at 11:10
@ArastoSahbaei Alright. Could you please create a [Minimal, Complete, and Verifiable example](https://stackoverflow.com/help/mcve)? It's difficult to say what might be wrong without seeing how your data is structured. Component `props` is also an object, so the issue might be that you are trying to use `map` depending on what your `props` variable is defined as. – Tholle Apr 15 '19 at 11:11

How to remove null values from props.map

1 Answers1