如何在单击按钮时在 material-ui 中打开对话框

Question

export default class Help extends Component {
    componentWillMount(){
        this.state = {open:false};
    }


    handleOpen() {
        this.setState({open: true});
    }

    handleClose() {
        this.setState({open: false});
    }

    render() {
        const actions = [
      <FlatButton
        label="Cancel"
        primary={true}
        onTouchTap={this.handleClose}
      />,
      <FlatButton
        label="Submit"
        primary={true}
        keyboardFocused={true}
        onTouchTap={this.handleClose}
      />,
    ];
        return (
            <div className="container-fluid">
                <button type="button" className="btn btn-primary active" id="Hlp" onTouchTap={this.handleOpen}>Help</button>
                <Dialog
                    title="Dialog With Actions"
                    actions={actions}
                    modal={false}
                    open={this.state.open}
                    onRequestClose={this.handleClose}
                    >
                    The actions in this window were passed in as an array of React objects.
                </Dialog>
            </div>
        );
    }
}

我已经使用 material-ui 打开一个对话框来点击按钮，现在我在控制台中看到一个错误，说无法读取属性 'prepareStyles' of undefined..我可以在屏幕上看到按钮

Answer 1

不确定您是否仅从代码段中省略了它们，但请确保在您的真实代码中，您在顶部具有正确的 material-ui 导入：

import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';

如何在单击按钮时在 material-ui 中打开对话框

how to open a dialog in material-ui on button click

reactjs

redux

material-ui