jsx Questions
16
Solved
How do I do the following CSS media query in Reactjs?
.heading {
text-align: right;
/* media queries */
@media (max-width: 767px) {
text-align: center;
}
@media (max-width: 400px) {
text-al...
Burghley asked 2/2, 2019 at 9:19
6
Solved
I'm building a React app, with create-react-app.
I got the following error when running ESLint:
8:3 error 'document' is not defined no-undef.
My app runs without error, but I got this ESLint erro...
15
I am trying to fix this lint error at line const def = (props) => { in following sample code.
const propTypes = {
prop1: PropTypes.string,
prop2: PropTypes.string,
prop3: PropTypes.string,
prop...
2
Current Behavior
I have created a sample nx.dev react application with a publishable react library (ui-public). When I try to build the publishable react library it throws below error
Repo where is...
Chyme asked 13/4, 2021 at 3:31
2
Solved
I'm trying to create a Material UI Autocomplete component that essentially just displays search results to the user. Some of the options' names will be duplicates, but they will all have unique IDs...
Domineering asked 30/9, 2021 at 16:38
17
I have created this app with npx create-react-app. After this i have deleted all the files except index.js in src folder. Then Hot reload is not working. I have go to chrome and manually refreshing...
Capel asked 25/12, 2020 at 5:40
3
Solved
I'm starting out with Vite for a React application but unable to get jest tests working. I am trying to use Vitest with experimental ES module.
I am getting:
FAIL src/App.test.tsx [ src/App.test.ts...
Alidaalidade asked 9/4, 2023 at 14:11
20
Solved
I've just started learning React and got stuck at this error.
Uncaught TypeError: Cannot read property 'pathname' of undefined
at new Router
Here is my code:
var React = require('react');
...
Bushy asked 25/4, 2017 at 20:23
3
I'm trying to display profile of cooks with the images this person may have. I have an array of cooks with some information like name and profile picture. Cooks array also contains an array of pict...
Hectorhecuba asked 29/12, 2017 at 7:50
4
In my react app whereever i place h1 tag it just showing a normal font. On inspecting i found that my text is rendering as h1 but style of h1 is
h1, h2, h3, h4, h5, h6 {
font-size: inherit;
font-...
2
Solved
I want to use escape characters in React application, couldn't found a way to use escape characters in react application.
Please share if anyone knows?
TIA
3
Right now I am using the prompt command as a workaround to copy arbitrary text out of my JSX script in Photoshop.
prompt("to copy",(horizontalcenter.toString()) + ", " + verticalcenter.toString())...
6
Vite does not allow usage of JSX syntax within .js files by default.
I have already renamed my files to .jsx (or .tsx), but I have external dependencies that I cannot rename.
Example error from Vit...
Callis asked 29/11, 2022 at 21:27
6
Solved
I get this error when using "Cropper" from the react-easy-crop lib, I've tried a few things that I found on forums such as adding @types/react, importing * as React from "react"...
Footsie asked 17/9, 2021 at 8:22
12
Solved
There is something I find very confusing when working in React.js.
There are plenty of examples available on internet which use .js files with React but many others use .jsx files.
I have read abou...
Beck asked 12/9, 2017 at 6:34
4
Solved
I am generating a dl in React:
<dl>
{
highlights.map(highlight => {
const count = text.split(highlight).length - 1;
return (
<>
<dt key={`dt-${highlight.id}`}>{highlight...
Risky asked 18/12, 2019 at 11:22
6
Solved
How do I change an image on hover in JSX
I'm trying something like this:
<img src={require('../../../common/assets/network-inactive.png')}
onMouseOver={this.src = require('../../../common/asse...
Businesslike asked 9/2, 2018 at 10:15
20
I use this code to margin my Button from top:
const makeTopMargin = (elem) => {
return styled(elem)`
&& {
margin-top: 1em !important;
}
`;
}
const MarginButton = makeTopMargin(But...
Nationalism asked 10/8, 2018 at 17:9
15
Solved
Here's what I tried and how it goes wrong.
This works:
<div dangerouslySetInnerHTML={{ __html: "<h1>Hi there!</h1>" }} />
This doesn't:
<div dangerouslySetInnerHTML={{ __h...
Dishonor asked 28/9, 2016 at 21:42
6
Solved
class App extends Component {
constructor(props){
super(props);
this.state={ recipes :[] }
this.addRecipe=this.addRecipe.bind(this);
}
addRecipe (recipe) {
console.log({...recipe})
this....
5
I've run into a bit of a snag.
I realized that a partner on my project set up a file as .js instead of .jsx.
I switched the filetype to match the rest of the files in the project and now I'm get...
Mercado asked 12/12, 2019 at 12:17
28
I have a very simple functional component as follows:
import * as React from 'react';
export interface AuxProps {
children: React.ReactNode
}
const aux = (props: AuxProps) => props.childr...
Pow asked 9/12, 2018 at 2:38
13
Solved
I've made a sticky footer higher-level component that wraps other components inside itself:
Footer.js
//this is a higher-order component that wraps other components placing them in footer
var styl...
10
Solved
I want to define jsx like this:
<table style={{'--length': array.lenght}}>
<tbody>
<tr>{array}</tr>
</tbody>
</table>
and I use --length in CSS, I also have ...
Incorporator asked 24/8, 2018 at 13:0
17
Solved
I'm trying to set up react-router in an example application, and I'm getting the following error:
You should not use <Link> outside a <Router>
My app is set up like so:
Parent compo...
Hinson asked 6/2, 2018 at 10:3
1 Next >
© 2022 - 2025 — McMap. All rights reserved.