React中のrefとcontextを詳しく説明します.

React中のrefとcontext先端が設計した二つの重要な問題:変化と非同期.この二つをまとめると、先端の状態管理です.状態管理は主に三つの方面の問題に分けられます.

                 ====》  ====》  

先端の状態管理には多くのソリューションがあります.ただ一つの点に過ぎません.どうやってロジックがあり、段階的に先端の状態を管理しますか?(結局、一つの機能を実現するのは簡単です.滝の流れのコードがプログラミングされたら、コードの保護者に災難を与えます.)本文は主にReactの状態管理について述べます.reactコンポーネントの状態は、主に二つのパラメータによって決定され、stateとprops、一番いいコンポーネント設計方式は、コンポーネントの出力はpropsと関連しています.(多くは説明しない)プログラマーにとっては、プログラムの観点から、1、コンポーネントの内部パラメータを取得する2、コンポーネントをまたいでパラメータを伝達するReactでは、階層的なコールバック関数によって上の機能が実現されるのは当然ですが、Reactは他の方法を提供しています.
1、ref公式解釈

    Refs provide a way to access DOM nodes or React elements created in the render method.

refsは、DOMノードまたはReactコンポーネントで作成された要素を取得するために提供される.周知のように、コンポーネントレンダリングが完了する前にDOMを取得すると、コンポーネントはまだページにロードされていないので、componentDidUpdateまたはcomponentDidMountの後にしか取得できません.refsの使い方

//          
constructor(props) {
    super(props);
    this.myRef = React.createRef();
  }
//      
render() {
    return 
 />;
  }
//                ？
this.myref.current，     
  
         ？ 
 1）     html  ，       ihtml   
 2）        ，      （mount）    
        ： 
 ref=“   “   ，      ref   
   ref         ，     callback   
         ，  callback    
  component    ，componentDidMount    ， 
  componentDidUnmounted     null， 
         
          callback ？ 
 React.forwardRef
 
  
const FancyButton = React.forwardRef((props, ref) => (
  ref={ref} className="FancyButton">
    {props.children}
  
));

// You can now get a ref directly to the DOM button:
const ref = React.createRef();
ref={ref}>Click me!;
   callback props  callback      ？
refはpropsとして えられず、   にしかいないので、HOCsに われることが いです.  :  のコンポーネントには  がありません.  として、refはコンポーネントにとって、  の のkey:valueです.
2、contextは、  のコンポーネントでパラメータAPIを  しないようにするために
React.createContext:     context  
     const {Provider, Consumer} = React.createContext(defaultValue);
Provider：    consumer 
    value={/* some value */}>
consumer：  context  ，    React   
    
  {value => /* render something based on the context value */}
  すると、1、context  を  します.2、providerでconsumerコンポーネントを みます.
    :React  サイト