コンポーネント

Question

反応し、私は自分の行動

export const fetchDeviceData = (deviceData: Object): ThunkAction => (dispatch: Dispatch, getState: GetState, axios: any) => { 

    console.log('inside fetchDeviceData', deviceData); 
    return dispatch(fetchDeviceDataAPI(axios, url, deviceData)); 

}; 

に以下の機能を持っていると私は

私のコンポーネントでcomponentDidMount（）ブロックで次のようにそれを呼び出します

// type declaration (imported from a separate file) 
export type DeviceReg = { 
    [deviceData: Object]: { 
     readyStatus: string, 
     err: any, 
     payload: Object, 
    } 
}; 

// Prop type declaration 
type Props = { 
    device_reg: DeviceRegType, 
    fetchDeviceData:() => void, 
} 

componentDidMount() { 
    const x = this.getDeviceData(); 
    console.log('header mount mobile', x); 
    action.fetchDeviceData(x); 
} 

// The connector 
const connector: Connector<{}, Props> = connect(
    ({ device_reg }: Reducer) => ({ device_reg }), 
    (dispatch: Dispatch) => ({ 
     fetchDeviceData: (deviceData) => dispatch(action.fetchDeviceData(deviceData)), 
    }), 
); 
export default Header; 

問題は、ファンクションにdispatch: Dispatch, getState: GetState, axios: anyというパラメータを含めると、fetchDeviceData（x）関数が呼び出されないという問題ですが、それ以外の点では問題ありません。私が既にそれらの時間の負荷を確認しているので、輸入と依存は問題ではありません。

どんな提案、ヒント、または解決策も大きな助けになります。私の問題に関して何らかの説明や文脈が必要な場合は、私に知らせてください。

ありがとうございます。

Answer 1

をdispatch: Dispatch, getState: GetState, axios: anyから削除できますか？

私は、それがredux-thunkによって注入されるので、ディスパッチとgetStateだけであると考えられます。

Answer 2

は、オブジェクト形式を使用するように接続コードを変更してみてください：

connect(
    <yourMapStateToProps>, 
    { 
     fetchDeviceData: actions.fetchDeviceData, 
    }  
) 

これはあなたが呼び出すための小道具としてfetchDeviceDataを利用できるようにする必要があります。

また、あなたが `あなたのコンポーネントをconnect`方法を共有することができる唯一のdispatchとgetState