React-Redux Dispatch Bileşeninden İşlem

Question

Düğme tıklatmasından bir eylem göndermeye çalışıyorum.

Bileşenimi oluşturdum. Bir Sağlayıcı tarafından bileşene iletilen depoya bağlarım.

Uncaught TypeError: this.doSearchClick is not a function

benim ithalatı var: Ama bir hata alıyorum

import React, { Component, PropTypes } from 'react'; 
import { connect } from 'react-redux'; 
import action_doSearch from '../../actions/searchActions' 

Benim bileşen:

class SearchForm extends React.Component { 
    constructor(props, doSearchClick) { 
    super(props); 
    this.search = this.search.bind(this); 
    this.doSearchClick = doSearchClick; 
    } 

    search() { 
    this.doSearchClick('bla bla from search'); 
    } 

    render() { 
    return(
     <div> 
     <button onClick={this.search}>Search</button> 
     </div> 
    ); 
    } 
} 

emin değil bu gerekiyorsa: Sonunda

SearchForm.propTypes = { 
    doSearchClick: PropTypes.func.isRequired 
}; 

connect şeyler:

const mapStateToProps = (state) => { 
    return { 
    state 
    } 
}; 

const mapDispatchToEvents = (dispatch) => { 
    return { 
    doSearchClick: (searchCriteria) => { 
     dispatch(action_doSearch(searchCriteria)); 
    } 
    }; 
}; 
const SearchFormConnected = connect(
    mapStateToProps, 
    mapDispatchToEvents 
)(SearchForm); 

üst düzeyde ben Sağlayıcısı aracılığıyla mağaza aşağı geçmek: Ben de bağlam aracılığıyla mağaza erişerek bunu başarmak için çalıştık

import { Provider } from 'react-redux' 

const finalCreateStore = compose(
    applyMiddleware(
     middleware, 
     thunk 
    ), 
    DevTools.instrument() 
)(createStore); 

const store = finalCreateStore(reducer); 

ReactDOM.render(
    <Provider store={store}> 
    .... 

(işe yaramadı ve kullanım dışı olabilir) ve Ayrıca @connect özniteliğini kullanarak (bana benzer bir hata verdi). Sahne nesnesine iletilecek olan

Answer 1

doSearchClick. Bu yüzden ona erişmek için props.doSearchClick yazmanız gerekiyor.

Answer 2

Bu:

sizin SearchForm bileşeni kendi babadan sahne olarak doSearchClick adında bir işlevi almak için bekliyor

SearchForm.propTypes = { 
    doSearchClick: PropTypes.func.isRequired 
}; 

araçları.

baba bu çocuk yapıcısı ikinci param `context` değil,` doSearchClick` olduğunu

props.doSearchClick