javascript - react - ¿Reaccionar con Redux? ¿Qué pasa con la cuestión del "contexto"?

redux saga

Question

Normalmente publico cosas relacionadas con el código en Stack, pero esta es más una pregunta sobre cuáles son los pensamientos generales de la comunidad.

Parece que hay muchas personas que abogan por el uso de Redux con React para administrar datos / estado, pero al leer y aprender ambos me he encontrado con algo que no parece correcto.

Redux

Al final de esta página: http://redux.js.org/docs/basics/UsageWithReact.html (Pasando la tienda) recomienda usar la "Magia" de React ''Context''.

Una opción sería pasarlo como accesorio a cada componente del contenedor. Sin embargo, se vuelve tedioso, ya que tiene que almacenar el cable incluso a través de componentes de presentación solo porque representan un contenedor profundo en el árbol de componentes.

La opción que recomendamos es usar un componente especial React Redux llamado para hacer que la tienda esté mágicamente disponible para todos los componentes del contenedor ...

Reaccionar

En la página React Context ( https://facebook.github.io/react/docs/context.html ) tiene una advertencia en la parte superior:

El contexto es una característica avanzada y experimental. Es probable que la API cambie en futuras versiones.

Luego en la parte inferior:

Así como las variables globales se evitan mejor al escribir código claro, debe evitar el uso del contexto en la mayoría de los casos ...

No utilice el contexto para pasar los datos de su modelo a través de componentes. Enhebrar sus datos a través del árbol explícitamente es mucho más fácil de entender ...

Entonces...

Redux recomienda usar la función Reaccionar ''Contexto'' en lugar de pasar la store a cada componente a través de ''accesorios''. Mientras que React recomienda lo contrario.

Además, parece que Dan Abramov (el creador de Redux) ahora trabaja para Facebook (el creador de React), solo para confundirme más.

• ¿Estoy leyendo todo esto bien ...?
• ¿Cuál es el consenso general actual sobre este tema ...?

Answer 1

El contexto es una característica avanzada y está sujeto a cambios. En algunos casos, sus comodidades superan sus desventajas, por lo que algunas bibliotecas como React Redux y React Router eligen confiar en él a pesar de la naturaleza experimental.

La parte importante aquí es la palabra bibliotecas . Si el contexto cambia su comportamiento, nosotros , como autores de la biblioteca, tendremos que ajustarnos . Sin embargo, siempre que la biblioteca no le pida que use directamente la API de contexto, usted, como usuario, no debería tener que preocuparse por los cambios.

React Redux usa el contexto internamente, pero no expone este hecho en la API pública. Por lo tanto, debe sentirse mucho más seguro usando el contexto a través de React Redux que directamente porque si cambia, la carga de actualizar el código estará en React Redux y no en usted.

En última instancia, React Redux aún admite siempre pasar la tienda como accesorio, por lo que si desea evitar completamente el contexto, tiene esa opción. Sin embargo, diría que esto no es práctico.

TLDR: evite usar el contexto directamente a menos que realmente sepa lo que está haciendo. Usar una biblioteca que depende internamente del contexto es relativamente seguro.

Answer 2

Hay un módulo npm que hace que sea realmente fácil agregar redux al contexto de reacción

https://github.com/jamrizzi/redux-context-provider

https://www.npmjs.com/package/redux-context-provider

import React, { Component } from ''react'';
import ReduxContextProvider from ''redux-context-provider'';
import createStore from ''./createStore'';
import actions from ''./actions'';
import Routes from ''./routes'';

export default class App extends Component {
  render() {
    return (
      <ReduxContextProvider store={store} actions={actions}>
        <Routes />
      </ReduxContextProvider>
    );
  }
}

Answer 3

No sé sobre otros, pero prefiero usar el decorador de conexión de react-redux para envolver mis componentes de modo que solo los accesorios de la tienda que necesito se pasen a mi componente. Esto justifica el uso del contexto en cierto sentido porque no lo estoy consumiendo (y sé, por regla general, que cualquier código del que esté a cargo no lo consumirá).

Cuando pruebo mis componentes, pruebo el componente no empaquetado. Debido a que react-redux solo pasó los accesorios que necesitaba en ese componente, ahora sé exactamente qué accesorios necesito cuando escribo las pruebas.

Supongo que el punto es que nunca veo la palabra contexto en mi código, no la consumo, ¡hasta cierto punto, no me afecta! Esto no dice nada sobre la advertencia "experimental" de Facebook. Si el contexto desapareciera, estaría tan jodido como todos los demás hasta que se actualizara Redux.