Cuando uso reaccionar, mi jefe no me permite usar jquery. ¿Por qué?
Tener una reunión y una charla informal. Aunque Vue no es React, los principios de los dos son básicamente. similar. Trabajo en ambos al mismo tiempo. Todos tienen alguna experiencia en desarrollo; así que mi punto de vista es:
React en sí es un marco de trabajo front-end, a diferencia de JQ, que es una biblioteca de clases.
El principio y el impulsor de React es representar el DOM virtual comparándolo con el flujo de la tienda. No necesito operar el árbol DOM en absoluto.
La documentación oficial de React deja muy claro que React hace muchas cosas que jq puede hacer. Solo necesita saber qué es el enlace bidireccional y luego utilizar eventos personalizados de enlace y basados en datos.
Cuando usas JQ en reaccionar, debes obtener el nodo dom, es decir, el árbol dom no se agregará a la página hasta que componenteDidMount. Aunque no es grave, habrá algunos conflictos en circunstancias especiales. Por ejemplo, cuando se usa reaccionar y JQ para operar el estilo de un nodo al mismo tiempo, puede causar problemas de sincronización de estado. Consulte el punto 5 a continuación (práctico). Además, existe un problema de rendimiento. Tomemos el ejemplo más simple, que no es representativo. Imagine que el dispositivo de paginación representado por reaccionar y JQ será más eficiente cuando haya muchos nodos en la página. Además, si la paginación se implementa con JQ y el contenido de paginación se implementa con reaccionar, cada vez que JQ haga clic en el número de página, usará reaccionar para representar el contenido de paginación y luego usará JQ para establecer el número de página, lo cual no es problemático. en absoluto. )
¿Importado? ¿Reaccionar? {?¿Componente? }?¿De donde? "Reaccionar";
¿Clase? ¿Mi componente? ¿extender? ¿Componentes? {
¿Constructor (accesorios)? {
Super (prop);
¿Este estado? =?{isHover:? false };
this.onMouseEnter? =?esto . onmouseenter . bind(esto);
}
componentDidMount()? {
$("#aaa "). open('hover',?()=>?{
$(this).add class(' mi hover ');
});?
}
onMouseEnter()? {
this.setState({isHover?:?true});
}
render()? {
¿constante? {?Isofer? }?=?este estado;
return(
& ltdiv?id="aaa "?onMouseEnter = { this . onMouseEnter }?"hover"?:? '} & gt& lt/div & gt;
);
}