Red de conocimiento informático - Problemas con los teléfonos móviles - Resumen de las preguntas de entrada de umi+ts

Resumen de las preguntas de entrada de umi+ts

React cambia muy rápidamente. Antes, estaba acostumbrado a usar hashHistory y browserHistory directamente, pero no estaba acostumbrado a los cambios en react-router4, así que simplemente usé los umijs de Alibaba directamente.

Los siguientes son algunos de ellos. Mis ideas en el proceso de aprendizaje de umi.

Para aprender el marco front-end, leer directamente los documentos oficiales es la mejor manera de aprender el enlace del documento oficial de umi, pero en general, los tutoriales escritos en el documento oficial de umi no son muy detallados y puede estar más orientado a los desarrolladores front-end. Sin embargo, su pregunta puede responderse en las preguntas frecuentes de su proyecto github, que es donde encontré enlaces a preguntas resumidas de usuarios que resolvieron muchos de mis problemas.

Primero, hablemos de las ventajas de umi: hasta donde yo sé, la mayor ventaja de umi es que no requiere que configures muchos otros parámetros y no requiere que escribas reaccionar manualmente. -router, porque el nombre de la carpeta predeterminado en la página es directamente la ruta de enrutamiento, y no necesita configurar el dll usted mismo, porque todos estos dll están integrados y usa dva en lugar de reaccionar-router. Se puede decir que es una solución de flujo de datos sin API.

Por otra parte, solo tengo redux-thunk y la versión anterior de React Foundation. Encontré varios problemas en el proceso de aprendizaje de la pila de tecnología umi + dva + ts:

1. , efectos y pregunta de cambio de nombre de llamada de reductor

En general, modifique el estado de uso de reducer Mi pregunta sobre stackoverflow está en el enlace: Mi pregunta sobre stackoverflow está en el siguiente enlace: Mi pregunta, básicamente usa el. El paradigma de componentes resuelve este problema. Esto también se menciona en Hello React y TypeScript.

3. Uso de menos módulos

Originalmente, la configuración predeterminada de umi admitía menos, pero cuando usé la configuración de andamio que viene con umi2.6.12, cambié los tipos en el El directorio raíz .d.ts less se declara como módulo '*.less';, lo que hace que less no se pueda importar como módulo.

4. Error de control del botón antd

Este problema se ha solucionado y el enlace de mi problema original está publicado aquí: Mi problema, el problema se ha resuelto, solo cambie @types/react versión.

5. Problemas de diseño

En realidad, no sé mucho sobre el diseño del marco umi, pero si desea prohibir que ciertas páginas usen ciertos diseños, solo necesita para configurar el atributo props.location .path para juzgar y luego hacer algunas selecciones al respecto. Simplemente haga algunas selecciones para el atributo de ruta:

6. El proyecto no se puede cargar en git

Cuando envío este paso con git, se mostrarán algunos errores, pero no es así. Afecta el funcionamiento del proyecto, lo más molesto es que algunas etiquetas no se cierran automáticamente. Utilizo antd Menu.Item y me hace cerrar automáticamente, lo cual es imposible. mi menú? Así que adopté un enfoque más violento: deshabilitar "precommit": cada vez que cargaba el proyecto, deshabilitaba "precommit": "lint-staged" en el atributo scripts del archivo package.json y el resultado fue exitoso. Puede que haya otras formas mejores, pero por conveniencia, sigo usando este método para cargar el proyecto.

7. Enrutamiento

Este no es un problema real que encontré, ¡pero el enrutamiento de umi es realmente muy conveniente! Los dos métodos de salto más utilizados que utilizo son: uno es importar enrutador desde 'umi/router' y luego directamente router.push. El otro es importar {routerRedux} desde 'dva/router' y luego routerRedux. Empujar puede saltar. Se puede decir que estos dos métodos de salto satisfacen todas las necesidades del proyecto en el que estoy trabajando. No es necesario escribir manualmente un proveedor ni requiere una configuración tediosa de browserHistory después de que reaccionar-router4 pueda resolver el problema.

8. No hay ningún problema de envío en el atributo props

Esto en realidad es un problema ts en el archivo tsx, props.dispatch necesita especificar el tipo si lo encuentra. problemático, puede usar el formulario en el encabezado para ilustrar: class xxx extends React.Component class xxx extends React.Component formComponent{ Esto resuelve el problema del problema de envío de accesorios

Otra solución a este problema es establecer "noImplicitAny":false en el archivo tsconfig.json para que se pueda configurar cualquier tipo por defecto. Puede establecer un tipo arbitrario predeterminado, pero esto no es compatible con ts y se recomienda el enfoque anterior.