Redux Action沒有被解僱

我已經用Relay，Redux和GraphQL設置了一個應用程序。當我火的動作，以顯示下拉狀態不更新（當我使用反應 - 終極版devtools派遣行動的狀態更新。）我有以下作用：Redux Action沒有被解僱

export function showDropdown() { 
    return { 
    type: SHOW_DROPDOWN, 
    dropdownType: PROFILE_SETTINGS, 
    dropdownProps: {} 
    }                            
}

及以下成分

import React from 'react'; 
import { connect } from 'react-redux'; 

import { showDropdown } from '../../redux/actions/dropdownActions'; 

function StreamWidget() { 
    const onClickHandler =() => { 
    this.props.showDropdown(); 
} 

return (
    <div> 
    <a 
     href='#' 
     role='button' 
     onClick={ onClickHandler } 
    /> 
    </div> 
); 
} 
export default connect(null, { showDropdown })(StreamWidget);

當我點擊鏈接我得到 Uncaught TypeError: Cannot read property 'showDropdown' of undefined

，當我改變this.props.showDropdown()到showDropdown()我沒有得到錯誤，但沒有任何反應STO重新不更新。

我歡迎所有關於如何解決此問題的建議。三江源

// Router 
const Router = createFarceRouter({ 
    historyProtocol: new BrowserProtocol(), 
    historyMiddlewares: [queryMiddleware], 
    routeConfig: routes, 

    render: createRender({}), 
}); 

// Redux 
const store = createStore(
    rootReducer, 
    compose (
    applyMiddleware(thunk), 
    window.__REDUX_DEVTOOLS_EXTENSION__ && 
window.__REDUX_DEVTOOLS_EXTENSION__() 
) 
); 

// Render component into DOM element. 
const render = Component => { 
    ReactDOM.render(
    <AppContainer> 
     <Provider store={store}> 
     <Router resolver={new Resolver(environment)} /> 
     </Provider> 
    </AppContainer>, 
    document.getElementById('root') 
) 
}

來源

2017-06-16 Mary Cahill

你的功能是不是你的組件的道具，所以你應該直接調用它沒有this.props（showDropDown（））

此外，您有關於「標記爲必需」的錯誤，因爲您必須根據propTypes中的要求定義React屬性，因此應刪除相關行。

並且爲了激發一個動作，你應該調度它並且這樣做，你需要訪問該功能。這可以通過mapDispatchToProps函數和connect來完成。

來源

2017-06-16 14:06:26

當我在組件中這樣做。 '常量onClickHandler =（）=> props.openTheDropdown（）' 並定義 '常量mapDispatchToProps =（調度）=>（{ openTheDropdown：（）=> { 調度（{ 類型： 'SHOW_DROPDOWN'， dropdownType：'PROFILE_SETTINGS'， dropdownProps：{} }） } }）; 出口默認連接（空， mapDispatchToProps ）（StreamWidget）' 我仍然無法看到被解僱的行動。我認爲出於某種原因連接不正確地發送showDropdown的值.. –

在你的組件不要忘了通過this.props調用你的方法，而不只是道具。 –

您是否在點擊按鈕時看到該函數被調用？ –

道具作爲參數傳遞給你的函數傳遞：

import React from 'react'; 
import { connect } from 'react-redux'; 

import { showDropdown } from '../../redux/actions/dropdownActions'; 

function StreamWidget(props) { 
    const onClickHandler =() => props.showDropdown() 

    return (
    <div> 
    <a 
     href='#' 
     role='button' 
     onClick={ onClickHandler } 
    /> 
    </div> 
); 
} 
export default connect(null, { showDropdown })(StreamWidget);

來源

2017-06-16 13:39:11

謝謝，但即使在這些更改後，它仍然不會更新狀態。我已經編輯了這個問題來包含index.js。因爲我也遇到了一個錯誤，說'警告：失敗的道具類型：道具'children'在'App'中被標記爲必需的，但它的值是'undefined'。在App'中。也許店裏出了點問題。 –

@MaryCahill你有沒有定義任何'propTypes'？ –

主要''組件我有孩子作爲必需的節點。在問題的組件中，我將'showDropdown'作爲所需的函數。後者不抱怨 - 我相信這意味着該函數被定義.. –

Redux Action沒有被解僱

回答

相關問題