Stack Overflow
Stack Overflow

Questions tagged [react-grid-layout]

A draggable and resizable grid layout with responsive breakpoints, for React.

162 questions
2
votes
1 answer

DevExtreme React Grid

Anyone know how to change the fontSize of the TableHeaderRow in a DevExtreme React Grid? Here's an example of code from the website (https://devexpress.github.io/devextreme-reactive/react/grid/demos/featured/data-editing/) that I have been working…
M Xiao
  • 553
  • 1
  • 7
  • 14
2
votes
1 answer

react-grid-layout breakpoints

I'm looking at using the react-grid-layout component but the documentation is not good when it comes to explaining the terminology. Here are my questions: What's the difference between ReactGridLayout and ResponsiveReactGridLayout? What exactly…
Alvaro Mendez
  • 134
  • 2
  • 13
2
votes
4 answers

ReactJS: TypeError: this.state.data.map is not a function

-Can someone please help me with this. I am getting an error described in the title of this question. I want to put JSON data inside react-grid-layout component. This library can be found on (https://github.com/STRML/react-grid-layout) import React,…
user7637934
2
votes
0 answers

react grid layout not getting changed on data change reactively

I have two routes /abc and /xyz. When changing route from one to another the grid layout remains the same, it properties does not change but on hard reload they get changed and gives expected result. There are following two classes: Class 1: export…
Vinay Chaudhary
  • 318
  • 1
  • 6
2
votes
1 answer

React grid not rendered

In React, I am trying to create a basic grid using https://github.com/STRML/react-grid-layout. I have created two rectangles and I have given them a layout like this:
bsky
  • 19,326
  • 49
  • 155
  • 270
1
vote
1 answer

Determine which section is currently dispayed with react and Waypoint

I have quite simple react application: App.js: render() { return ( ); } BaseLayout: import React, { useEffect, useState } from 'react'; import Navbar from "./Navbar"; import Section1 from "./section1/Section1"; import Section2…
Unnamed
  • 111
  • 8
1
vote
0 answers

Is there any way to drag element from one grid into another in react-grid-layout?

In my project I'm creating a UI Builder using NextJS and react-grid-layout and I need to give user an opportunity to make nested elements. I have a page component which contains , and component which also contains…
Maxim
  • 11
  • 1
1
vote
1 answer

How to find new height unit while switching the row height in react-grid-layout?

I'm using react-grid-layout and using rowHeight to set the height of a "grid item" explicitly. Now i want to change the rowHeight to a smaller value (on click of a button). Current Behaviour: when the change is happened, all the tile heights are…
Shreyas Jadhav
  • 2,363
  • 4
  • 10
  • 23
1
vote
1 answer

Save react-grid-layout overlapping changes when the web browser reloads

I want to create widgets. Resize, drag, overlap. Although it is possible to overlap, the position is not saved when the web browser reloads it. I want to know what should I do to save grid items. This is react-grid dependency "react-grid-layout":…
Dinesh Garusinghage
  • 11
  • 4
1
vote
0 answers

Is there a way to set the rowHeight in react-grid-layout library such that all the content in cells appear?

I am using react-grid-layout library to create a board with draggable cards. The content of the cards are not static. Based on the settings input from the user, some components are added to the cards. In each card, there is a title, maximum three…
ultumn98
  • 31
  • 4
1
vote
1 answer

How can I replace the resizable handle icon? react-grid-layout

I'm working on a dashboard where I want to replace the resizable icon at the bottom right corner of the grid item in react-grid-layout. Is there a way to replace this icon with my own custom icon?
Ubaid
  • 737
  • 8
  • 18
1
vote
0 answers

React Grid Layout resets the layout when new item is added

I am using React Grid Layout. I followed the demo to create a simple layout. I wanted to add new items to the grid. However, if I resize any item and then add a new panel, the layout resets. I am not sure what is causing the layout to…
Ayushi
  • 31
  • 1
  • 3
1
vote
0 answers

React state infinite loading while using react-grid-layout

I am using react-grid-layout for my learning and implemented a simple example. Based on the documentation, we'll get the updated layout values on onLayoutChange function and getting the below error Maximum update depth exceeded. This can happen when…
mc-user
  • 1,769
  • 4
  • 14
  • 25
1
vote
1 answer

React-grid-layout - drag only on first div

I implemented react-grid-layout with two elements. The thing is I have text in the first element and because it is draggable I can't copy the text from it because the element is moving. I don't want to use a button to copy the text, but I was…
Or Nakash
  • 1,345
  • 1
  • 9
  • 22
1
vote
2 answers

'Item' is not defined react/jsx-no-undef

I imported @material-ui/core, @devexpress/dx-react-core @devexpress/dx-react-grid and some other modules but issue is not resolving. My App.js code: import Grid from '@material-ui/core/Grid'; import logo from './logo.svg'; import…
Kumail Baloch
  • 29
  • 1
  • 6
1 2 3
…
10 11