如何在ReactJs中传递函数？

我正在使用redux模式，但我不确定只是将1+的操作方法传递给哑组件。如何在ReactJs中传递函数？

现在在我的智能组件我有类似

<AddStorageItemButton {...this.props} />

但这种课程在经过的一切，我不希望这样。

我想是这样

<AddStorageItemButton test={()=>this.showAddStorageItemModal(this)} />

然后在我的部分我试图做

<a href="#"onClick={() => this.props.test(true) }> Add</a>

这里是我的功能。这里

export function showAddStorageItemModal(show) { 
    return function (dispatch) { 
     dispatch({ type: actions.SHOW_ADD_STORAGE_ITEM_MODAL, payload: show }); 
    }; 
}

编辑更我的结构

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

import 'materialize-css/sass/materialize.scss'; 
import '../styles/main.scss'; 


import AddStorageItemButton from './AddStorageItemButton.js'; 

import { showAddStorageItemModal } from '../actions/StorageItemActions.js'; 

class App extends React.Component { 
    render() { 
    return (
     <div> 
      <AddStorageItemButton {...this.props} test={this.props.showAddStorageItemModal(this)} /> 
     </div> 
    ); 
    } 
} 

function mapStateToProps(state) { 
    return { 
    // reducers 
    }; 
} 

function matchDispatchToProps(dispatch) { 
    return bindActionCreators({ 
    showAddStorageItemModal: showAddStorageItemModal, 
    }, dispatch); 
} 


export default connect(mapStateToProps, matchDispatchToProps)(App);

来源

2016-08-16 chobo2

//我希望你在构造函数结合showAddStorageItemModal到this

<AddStorageItemButton test={this.showAddStorageItemModal} /> 




<a href="#"onClick={() => this.props.test(true)() }> Add</a>

来源

2016-08-16 17:00:06

由于showAddStorageItemModal返回一个封闭，我想你想要做的是传递函数为依托的返回值什么：

<AddStorageItemButton test={this.showAddStorageItemModal(this)} />

当你点击这样一来，dispatch将被调用

来源

2016-08-16 16:54:11

如何在ReactJs中传递函数？

回答

相关问题