Is there a way where I could put a line break for each data it displays?-CodePudding

I have this array and I can already display it on the screen. I'm wondering if I can put a line break for each of the data it displays.

{
      name: "cartItems",
      label: "Product Name",
      options: {
        filter: true,
        sort: true,
        customBodyRender: (value, tableMeta, updateValue) => {
          // console.log(value, "cartItems");
          return value.map(
            (value) =>
              value.name  
              " ("  
              value.color  
              ") - "  
              " Qty:"  
              value.quantity  
              ","
          );
        }
      }
    }

As of now, it displays in one line like this:

Item name (item color) - Qty: 1 Item name (item color) - Qty: 2 Item name (item color) - Qty: 2

I wanted to somehow display it like this:

Item name (item color) - Qty: 1
Item name (item color) - Qty: 2
Item name (item color) - Qty: 2

Is this possible?

CodePudding user response：

Try to add \n

          return value.map(
            (value) =>
              value.name  
              " ("  
              value.color  
              ") - "  
              " Qty:"  
              value.quantity  
              ","   
              "\n"
          );

CodePudding user response：

Try this :

return value.map((value) => `${value.name} (${value.color}) - Qty: ${value.quantity}, 
`);