Preguntas etiquetadas con reactjs

Estoy usando el nuevo gancho useHistory de React Router, que salió hace unas semanas. Mi versión del router React es 5.1.2. My React está en la versión 16.10.1. Puedes encontrar mi código en la parte inferior. Sin embargo, cuando importo el nuevo useHistory desde react-router, me sale este error: Uncaught …

18 reactjs  react-router  react-hooks  react-router-dom  react-context 

Estoy usando el gancho UseHistory en react router v5.1.2 con typecript? Cuando ejecuto la prueba unitaria, tengo un problema. TypeError: No se puede leer la propiedad 'historial' de indefinido. import { mount } from 'enzyme'; import React from 'react'; import {Action} from 'history'; import * as router from 'react-router'; import …

18 reactjs  typescript  react-router  jestjs  enzyme 

Me refiero a la documentación de React Material-UI ( https://material-ui.com/components/autocomplete/ ). En el código de demostración, <Autocomplete options={top100Films} getOptionLabel={(option: FilmOptionType) => option.title} style={{ width: 300 }} renderInput={params => ( <TextField {...params} label="Combo box" variant="outlined" fullWidth /> )} /> Entiendo cómo funciona, pero no estoy seguro de cómo se supone que …

17 javascript  reactjs  material-ui 

Tengo una aplicación de reacción (aplicación A), creada hace aproximadamente 2 años usando create-react-app, y se expulsa. La aplicación se exporta como un módulo commonjs2 y se envía en un paquete NPM, para ser utilizada en un proyecto next.js (aplicación B). Todo salió bien hasta que actualicé algunos paquetes en …

16 reactjs  npm  webpack  next.js 

He escrito un botón personalizado ( MyStyledButton) basado en material-ui Button . import React from "react"; import { Button } from "@material-ui/core"; import { makeStyles } from "@material-ui/styles"; const useStyles = makeStyles({ root: { minWidth: 100 } }); function MyStyledButton(props) { const buttonStyle = useStyles(props); const { children, width, ...others …

16 javascript  css  reactjs  jestjs  enzyme 

Estoy escribiendo un proyecto React en código VS. Encontré este problema en el código VS. En mi proyecto, esta carpeta muestra Contiene elementos resaltados y sé que significa que hay un error en mis archivos. Pero en la foto , Revisé todos los archivos pero no encontré ningún error. Entonces …

16 reactjs  visual-studio-code 

Cuando intento acceder al componente de inicio de sesión de mi aplicación MERN en la versión de producción, obtengo una serie de los siguientes errores de tipo que se muestran en esta imagen: Mi aplicación ( https://github.com/ahaq0/kumon_schedule ) funciona perfectamente bien localmente y funcionaba perfectamente bien alojada en Heroku el …

15 reactjs  typescript  heroku  material-ui  mern 

Tengo una aplicación de reacción creada por create-react-app. Después de ejecutar npm start (el script de inicio está presente en package.json como "start": "react-scripts start") la consola dice Iniciando el servidor de desarrollo como de costumbre y activa el navegador. Pero después de esto, tanto la consola como el navegador …

15 reactjs  npm  create-react-app  react-scripts 

Recientemente comencé a usar TypeScript con Expo. He hecho todas las integraciones de linter / formateador typescript-eslintpara poder detectar la mayoría de los errores durante la codificación. Para verificar si el código se compila, ejecuto de npx tscvez en cuando y lo arreglo en consecuencia. Una cosa que aún no …

15 reactjs  typescript  react-native  expo 

Soy nuevo en Next.js y me pregunto cómo redirigir desde la página de inicio ( / ) a / hello-nextjs, por ejemplo. Una vez que el usuario carga una página y luego determina si path === / redirect to / hello-nextjs En react-router hacemos algo como: <Switch> <Route path="/hello-nextjs" exact …

15 html  reactjs  routing  react-router  next.js 

Estoy tratando de cargar una vista de detalles basada en una ruta react-router-dom que debería tomar el parámetro de URL (id) y usarlo para completar el componente. Mi ruta se ve /task/:idy mi componente se carga bien, hasta que trato de tomar el: id de la URL de esta manera: …

14 reactjs  react-router 

Veo que React.forwardRef parece ser la forma autorizada de pasar una referencia a un componente funcional secundario, desde los documentos de reacción: const FancyButton = React.forwardRef((props, ref) => ( <button ref={ref} className="FancyButton"> {props.children} </button> )); // You can now get a ref directly to the DOM button: const ref = …

13 javascript  reactjs  performance 

Estoy tratando de crear un nuevo proyecto usando create-react-appel comando dado en los documentos, es decir, npx create-react-app my-apppero no contiene carpetas como public srcy script.

13 reactjs  create-react-app 

He revisado las definiciones de los dos como: Las funciones puras son aquellas que no intentan cambiar sus entradas y siempre devuelven el mismo resultado para las mismas entradas. Ejemplo function sum(a, b) { return a + b; } Y la función Impura es aquella que cambia su propia entrada. …

12 javascript  reactjs  redux 

He instalado material-ui / lab para usar el componente de alerta, pero cada vez que lo importo con: import Alert from '@material-ui/lab/Alert';no se compila y arroja este error: ./node_modules/@material-ui/lab/esm/internal/svg-icons/SuccessOutlined.js Attempted import error: 'createSvgIcon' is not exported from '@material-ui/core/utils'. Así que traté de buscar en Google este problema y encontré otra …

12 javascript  node.js  reactjs  material-ui