mirror of
https://github.com/YMFE/yapi.git
synced 2024-12-09 05:00:30 +08:00
fix: popmpt使用自定义confirm
This commit is contained in:
parent
3f4c787e57
commit
5185774cbe
@ -1,4 +1,5 @@
|
|||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
|
import ReactDOM from 'react-dom';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Route, BrowserRouter as Router } from 'react-router-dom';
|
import { Route, BrowserRouter as Router } from 'react-router-dom';
|
||||||
@ -7,6 +8,7 @@ import User from './containers/User/User.js';
|
|||||||
import Header from './components/Header/Header';
|
import Header from './components/Header/Header';
|
||||||
import Footer from './components/Footer/Footer';
|
import Footer from './components/Footer/Footer';
|
||||||
import Loading from './components/Loading/Loading';
|
import Loading from './components/Loading/Loading';
|
||||||
|
import MyPopConfirm from './components/MyPopConfirm/MyPopConfirm';
|
||||||
import { checkLoginState } from './reducer/modules/user';
|
import { checkLoginState } from './reducer/modules/user';
|
||||||
import { requireAuthentication } from './components/AuthenticatedComponent';
|
import { requireAuthentication } from './components/AuthenticatedComponent';
|
||||||
|
|
||||||
@ -46,7 +48,13 @@ export default class App extends Component {
|
|||||||
return <Loading visible />;
|
return <Loading visible />;
|
||||||
} else {
|
} else {
|
||||||
r = (
|
r = (
|
||||||
<Router >
|
<Router getUserConfirmation={(msg, callback) => {
|
||||||
|
let container = document.createElement('div');
|
||||||
|
document.body.appendChild(container);
|
||||||
|
ReactDOM.render((
|
||||||
|
<MyPopConfirm msg={msg} callback={callback} />
|
||||||
|
), container);
|
||||||
|
}}>
|
||||||
<div className="g-main">
|
<div className="g-main">
|
||||||
<div className="router-main">
|
<div className="router-main">
|
||||||
{this.props.loginState !== 1 ? <Header /> : null}
|
{this.props.loginState !== 1 ? <Header /> : null}
|
||||||
|
50
client/components/MyPopConfirm/MyPopConfirm.js
Normal file
50
client/components/MyPopConfirm/MyPopConfirm.js
Normal file
@ -0,0 +1,50 @@
|
|||||||
|
import React, { Component } from 'react';
|
||||||
|
import { Modal, Button } from 'antd';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
|
// 嵌入到 BrowserRouter 内部,覆盖掉默认的 window.confirm
|
||||||
|
// http://reacttraining.cn/web/api/BrowserRouter/getUserConfirmation-func
|
||||||
|
class MyPopConfirm extends Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
visible: true
|
||||||
|
};
|
||||||
|
}
|
||||||
|
static propTypes = {
|
||||||
|
msg: PropTypes.string,
|
||||||
|
callback: PropTypes.func
|
||||||
|
};
|
||||||
|
|
||||||
|
yes = () => {
|
||||||
|
this.props.callback(true);
|
||||||
|
this.setState({ visible: false });
|
||||||
|
}
|
||||||
|
|
||||||
|
no = () => {
|
||||||
|
this.props.callback(false);
|
||||||
|
this.setState({ visible: false });
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillReceiveProps() {
|
||||||
|
this.setState({ visible: true });
|
||||||
|
}
|
||||||
|
|
||||||
|
render() {
|
||||||
|
if (!this.state.visible) {
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
return (<Modal
|
||||||
|
title="你即将离开编辑页面"
|
||||||
|
visible={this.state.visible}
|
||||||
|
footer={[
|
||||||
|
<Button key="back" onClick={this.no}>取 消</Button>,
|
||||||
|
<Button key="submit" onClick={this.yes}>确 定</Button>
|
||||||
|
]}
|
||||||
|
>
|
||||||
|
<p>{this.props.msg}</p>
|
||||||
|
</Modal>);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default MyPopConfirm;
|
@ -135,7 +135,8 @@ class Content extends Component {
|
|||||||
<Prompt
|
<Prompt
|
||||||
when={this.state.curtab === 'edit' && this.props.editStatus ? true : false}
|
when={this.state.curtab === 'edit' && this.props.editStatus ? true : false}
|
||||||
message={() => {
|
message={() => {
|
||||||
this.showModal();
|
// this.showModal();
|
||||||
|
console.log('e');
|
||||||
return '离开页面会丢失当前编辑的内容,确定要离开吗?';
|
return '离开页面会丢失当前编辑的内容,确定要离开吗?';
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
|
Loading…
Reference in New Issue
Block a user