Question

我对redux＆amp; amp;反应;我想禁用onClick按钮以防止保存多个数据副本。我的按钮位于页脚组件中：

import React from 'react';

const Footer = React.createClass({

  render () {
    const { save, saveAs, onLeave, edit, disableButtons } = this.props;

    return (
      <footer className="footer">
        <button onClick={ save.bind(this, onLeave) } className="btn btn-secondary">{__( 'Save' )}</button>
        { edit && <div onClick={ saveAs.bind(this, onLeave) }  className="btn btn-primary save-as">{__( 'Save As' )}</div> }
      </footer>
    )
  }
});

export default Footer;

在react redux中，我将操作设置为：

export const SaveButton = bool => ({ type: ActionTypes.SAVE_BUTTON, bool})

export const SaveAsButton = bool => ({ type: ActionTypes.SAVE_AS_BUTTON, bool})

Reducer ：

const disableButtons = ( state=false, action ) => {
  switch ( action.type ) {
    case ActionTypes.SAVE_AUDIENCE:
      return action.bool
    case ActionTypes.SAVE_AS_AUDIENCE:
      return action.bool
  }
}

MapDispatchToProps在更高级别容器的connect函数中完成：

export default connect(({ onLeave, edit, disableButtons }) => Object.assign({}, { onLeave, edit, disableButtons }), allActions)(Module);

如何调度saveButton / saveAsButton操作以切换是否在页脚组件中禁用该按钮？这是错误的方法吗？谢谢！

使用Redux / React禁用onClick按钮

0 个答案: