How to set 2 items in each row by react-grid-layout?

 To set two items (or widgets) in each row using the `react-grid-layout` library, you can control the layout of your grid to ensure that the items are positioned side by side. Here's a basic example of how to achieve this:

Assuming you have two items that you want to place in each row, you can define the layout as follows:

```javascript

import React from 'react';

import GridLayout from 'react-grid-layout';

const MyGrid = () => {

  const layout = [

    { i: 'item1', x: 0, y: 0, w: 1, h: 1 },

    { i: 'item2', x: 1, y: 0, w: 1, h: 1 },

    { i: 'item3', x: 0, y: 1, w: 1, h: 1 },

    { i: 'item4', x: 1, y: 1, w: 1, h: 1 },

    // Add more items as needed

  ];

  return (

    <GridLayout

      className="layout"

      layout={layout}

      cols={2} // Set the number of columns in your grid

      rowHeight={100} // Adjust the height as needed

      width={800} // Adjust the width as needed

    >

      <div key="item1">Item 1</div>

      <div key="item2">Item 2</div>

      <div key="item3">Item 3</div>

      <div key="item4">Item 4</div>

      {/* Add more items here */}

    </GridLayout>

  );

};

export default MyGrid;

```

In this example, I've set up a grid with two columns (specified by `cols={2}`) and a row height of 100 units. The layout array ensures that items 1 and 2 are in the first row, and items 3 and 4 are in the second row. You can add more items to the layout and adjust the `x`, `y`, `w`, and `h` properties as needed to control the placement and size of your items.

Remember to customize the `cols`, `rowHeight`, and `width` props to fit your specific layout requirements.