read an array of objects in array of object

Question

I have a problem to map an array of objects in an array of objects...

this is my array in back

const demoCompletedData = [
  {
    id: 1,
    marketId: "1111-1111-1111-1111",
    title: "Autonomous car",
    picture: "https://th?id=OIP.fdvfdvfdvfdvfd&pid=Api",
    language: "English",
    flag: "🇬🇧",
    completed: true,
    date: "22/01/2019 10:30",
    rate: 9.1,
    categories: {
      de: 1,
      sp: 2,
      uk: 0,
      fr: 1,
      us: 4,
    },
  },
module.exports = demoCompletedData;

And my code to read this in front : fetchDemo

  fetchDemo() {
    this.props.demoFetchRequest();
    const { marketId } = this.props.match.params;
    axios.get(`/api/v1/passport-authenticate/market/${marketId}`)
      .then((res) => {
        return res.data;
      })
      .then(demo => this.props.demoFetchSuccess(demo))
      .catch(error => this.props.demoFetchError(error));
  }

and my return and my return and my return and my return

const { demo } = this.props;

and my render and my render and my render and my render

<p>
            Categories :
            {
              Object.values(`${demo.categories}`).map((category) => {
                return (
                  <ul>
                    <li>
                      {category.toString()}
                    </li>
                  </ul>
                );
              })}
          </p>

How to solve this issue?

EDIT:

Thanks for your help. I want to read 'categories' and map it to show value of 'de', 'fr','us, 'uk' ... but I'm completely lost !

{
              Object.keys(demo).filter((x) => { return x === 'categories'; }).map((category) => {
                return (
                  <ul>
                    <li>
                      {category.de}
                    </li>
                  </ul>
                );
              })}

something like that :

{category.de > 0 ? `de : ${category.de}` : ''}
{category.us > 0 ? `us : ${category.us}` : '' }

Answer 1

Your category is object and you are trying to convert it to string. Try below code.

If you want key then

<li>
    {Object.keys(category)[0]}
</li>

If you want value then

<li>
    {Object.values(category)[0]}
</li>