Questions tagged [react-responsive]
7 questions
1
vote
0 answers
Hydration failed with react-responsive generate div
I am rendering two different sections on my page because on desktop it should be a slider, and on mobile all should scroll. I'm using react-responsive, and on mobile I'm getting an error (3 times the same), but not on desktop load. If I close the…
Dikeneko
- 344
- 4
- 19
1
vote
1 answer
Respond to media queries in React js?
So I solved this problem with using useEffect and innerwidth. However i dont know if it is reliable way. Sometimes it is off by couple of pixels. This is my code:
const [windowSize, setWindowSize] = useState({
width: undefined,
height:…
Happy Coconut
- 973
- 4
- 14
- 33
1
vote
4 answers
react - not able to import object from another js file
responsive.js
import { useMediaQuery } from "react-responsive";
export default {
sm: useMediaQuery({ maxWidth: 768 }),
md: useMediaQuery({ minWidth: 769, maxWidth: 1024 }),
lg: useMediaQuery({ minWidth: 1025 }),
};
When I tried to import it…
CCCC
- 5,665
- 4
- 41
- 88
0
votes
0 answers
Using useMediaQuery how can we make the screen responsive?
Using useMediaQuery in react responsive, how can we make the Login component responsive for following resolutions ? Could someone please advise here ?
1920 * 1080
1536 * 864
and 1366 * 768
import React, { useState, useEffect, useCallback } from…
soccerway
- 10,371
- 19
- 67
- 132
0
votes
0 answers
Screen resolution set using react responsive doesn't work
Using 'react-responsive' how can I make responsive for multiple resolution, I have tried below, but not getting desired output: Could someone suggest how to use it ?
1920px
1536px
import React from 'react';
import { useNavigate } from…
soccerway
- 10,371
- 19
- 67
- 132
0
votes
2 answers
how can i use components based on device size?
How can we display different html elements or components based on the size of the device? In react, a package called react-responsive can be used.But in Next, in every component that I use this package, ssr does not run on that component.
What do…
javad kh
- 11
- 4
0
votes
1 answer
react - is it possible to globalize some variables and use them everywhere without import
I am using react-responsive in development.
Let's say I have a file called responsive.js.
const isBigScreen = useMediaQuery({ query: '(min-width: 1824px)' })
const isTabletOrMobile = useMediaQuery({ query: '(max-width: 1224px)' })
const…
CCCC
- 5,665
- 4
- 41
- 88