Dva: 反応ライフサイクルイベントがどこに書かれているかについて質問しますか？

コンポーネントのコンポーネント関数がReact.Componentを拡張するように変更された場合、どのような影響がありますか？

無効。それでも前の習慣に従って書き込み、次にデータレイヤーにdvaを追加します。

次に、データレイヤーにdvaを追加しますか？参加するにはどうすればよいですか？
昨夜、dva + andMobileの使用を開始する方法を理解しました。

https://github.com/sorrycc/blog/issues/18このチュートリアルに従って、理解してみてください。

私は行かず、もう一度読んで、いくつかの情報を検索しました。主な問題は、reduxの理解です。
componentWillMount（）とcomponentDidMount（）の書き込み位置に関連して、特定のポインターを教えていただけますか？

componentWillMount（）はルーティングのフックに書き込まれますか？
componentDidMount（）は外部コンポーネントに書き込みますか？

同じ質問

@ xttianma @ CodeSuPrManはステートレスコンポーネントを
https://facebook.github.io/react/docs/components-and-props.htmlを参照して

あなたは再構成を見ることができます

よろしく、

ニック・チェン

携帯電話：+86118918960666（中国）
weChat：nick_zheng88
Eメール： [email protected]

16:16で2017年1月18日に、CodeSuPrMan [email protected]書きました：

これは元のステートレスコンポーネントです
const LeftNavBefore =（{menus、dispatch}）=> {const {mode、ItemTree
} = props.menus; const constItemTree = ItemTree; const
NavMenu = LoadMenuTree（ItemTree、ItemTree）;関数changeMode（value）{
dispatch（{type： 'menus / changeMode'、payload：{mode：value？ 'vertical'： 'inline'、
ItemTree：ItemTree}}）....}
ライフサイクル関数を追加する必要のあるコンポーネントを高レベルのコンポーネントの形式でパッケージ化したい（この関数は一般的なメソッドに抽出され、将来追加する必要のあるすべてのライフサイクル関数はこのメソッドでパッケージ化されます） ）、
このように、すべての基本コンポーネントはステートレスであり、ライフサイクルの均一なパッ​​ケージ化が必要です。
function wapperComponentsStatus（{ref}）{return ComposedComponent => {
戻りクラスwapperはReact.Componentを拡張します{componentWillMount（）{
...（後で抽出）} componentDidMount（）{...（後で抽出）} render（）{return
}}}}

`let LeftNav = ref => wapperComponentsStatus（{ref：ref}）（LeftNavbefore）;
ここに接続するには、モデルに接続して状態を渡し、ディスパッチする必要があります
関数mapStateToProps（{menus}）{
{メニュー}を返す;
}

デフォルトのconnect（mapStateToProps）（LeftNav）; `をエクスポートします。

しかし、このように書くとエラーが報告されます。reactとreduxの理解はそれほど深くないので、私の考えに従ってください。
wrapperComponentsStatusの小道具をLeftNavBeforeコンポーネントに渡す方法（主にステータス関数を渡すため）とredux
接続後に提供される状態とディスパッチも、LeftNavBeforeコンポーネントに渡されます。

—
あなたがコメントしたのであなたはこれを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/dvajs/dva/issues/506#issuecomment-273411035 、またはミュート
スレッド
https://github.com/notifications/unsubscribe-auth/AAbhwGIy_VXKLgjZAouvWgWg0i3aF6cGks5rTcpmgaJpZM4LkSJ0
。

あなたは再構成を見ることができます、前にライフサイクルのラップアラウンドがあるようです

現在、フォーマットに問題があります。これは、編集からの元のステートレスコンポーネントです。

const LeftNavbefore=({menus,dispatch})=>{
  const s=props;
  const{
    mode,ItemTree
  }=props.menus;
  const constItemTree=ItemTree;
  const NavMenu=LoadMenuTree(ItemTree,ItemTree);
  function changeMode(value){
    dispatch({
      type:'menus/changeMode',
      payload:{
        mode:value?'vertical':'inline',
        ItemTree:ItemTree
      }
    })
  }
  return(...)

ライフサイクル関数を追加する必要のあるコンポーネントを高レベルのコンポーネントの形式でパッケージ化したい（この関数は共通のメソッドに抽出され、将来追加する必要のあるすべてのライフサイクル関数はこの方法）、すべての基本コンポーネントがステートレスに維持されるように、ライフサイクルの統一されたパッケージ化が必要です

function wapperComponentsStatus({ref}) {
return ComposedComponent=>{
  return class wapper extends React.Component {
    componentWillMount(){
        ...（之后提取出来）
    }
    componentDidMount(){
        ...（之后提取出来）
    }
    render(){
      return <ComposedComponent {...this.props} />
    }
  }
}
  }
  let LeftNav=ref=>wapperComponentsStatus({ref:ref})(LeftNavbefore);

  function mapStateToProps({menus}){
    return {menus};
  }

  export default connect(mapStateToProps)(LeftNav);

しかし、このように書くとエラーが報告されます。reactとreduxの理解はそれほど深くないので、私の考えに従うかどうか、wrapperComponentsStatusの小道具をLeftNavBeforeコンポーネントに渡す方法（主にステータス関数を渡す方法）を尋ねてもよいですか？ redux接続状態とディスパッチもLeftNavBeforeコンポーネントに渡された後に提供します

https://github.com/acdlite/recompose/blob/master/docs/API.md#lifecycle

あなたはそれを自分で行うことができます

@nickzhengありがとう、私に見せて

私は英語が話せません。成熟した計画を待つしかありません。現在の方法は

ルーターの役割は、モデルとビューを接続し、React.Componentを使用して書き込みを行うことです。
その中には、展開されて閉じられたthis.propsが一時的なものであり、そこに何があるかは明らかです。このページが変更されない場合は、直接割り当てられます。

import React from 'react';
import { connect } from 'dva';
import { routerRedux } from 'dva/router';
import styles from './Page.css';
import { TabBar, Icon } from "antd-mobile";
import MyTabbar from './components/MyTabbar'

class Home extends React.Component {    
    render() {
        const {menu,selectedTab,dispatch}= this.props;
        const MyTabbarProps={ menu, selectedTab, dispatch }

        return (
            <div className="home">
                {this.props.children} 
                <MyTabbar {...MyTabbarProps} /> 
            </div>
        );
    }    
}

Home.propTypes = { 
    menu:React.PropTypes.array,
    selectedTab:React.PropTypes.number,
};

function mapStateToProps({home}) { return home }

export default connect(mapStateToProps)(Home);

recomposeを読んでください、しかし結局私はそれを自分で書きました

import React, { Component,PropTypes } from 'react';

  function wapperComponentsLifecycle({DidMount}) {
    return ComposedComponent=>{
      return class Wapper extends React.Component {
        componentWillMount(){

        }
        componentDidMount(){
          DidMount({props:this.props});
        }
        ...还可以添加别的生命周期函数
        render(){
          return <ComposedComponent {...this.props} />
        }
      }
    }
  }


export default  wapperComponentsLifecycle;

以下は、すべての基本コンポーネントまたはステートレスを維持するための呼び出しです。ライフサイクルをラップするには、この関数でライフサイクルをラップする必要があります。

  function DidMount({props}) {

    const{ dispatch}=props;
    dispatch({
      type:'menus/query',
    })
  }

  let LeftNav=wapperComponentsLifecycle({DidMount})(LeftNavbefore);

dvaドキュメントをもう一度見ると、次の段落があります。

所以在 dva 中，通常需要 connect Model的组件都是 Route Components，组织在/routes/目录下，而/components/目录下则是纯组件（Presentational Components）

ここにリンク

この一節について、私は理解しています。ルーターは、データ/コンポーネントなどを収集するルートコンポーネントを書き込みます...そして、コンポーネントは純粋な機能コンポーネントであり、次に純粋なコンポーネントであり、ライフサイクルイベントはありません。