0

使用 react-router-dom 的 4.1.1 版本，我有一个用“withRouter”包装的组件，我已将路由器添加到上下文中，并且在运行时我在上下文中看到了一个路由器对象。路由按预期运行，页面包含一个 redux 表单。但是尝试调用 setRouteLeaveHook 会导致：

未捕获的类型错误：this.context.router.setRouteLeaveHook 不是函数

所以我的问题是：为什么 setRouteLeaveHook 作为函数不可见？

在此之前我实际上已经尝试了几种方法，包括来自mknabe的代码，但它们都会导致相同的错误。

缩写代码：

import React from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { Field, reduxForm } from 'redux-form';
import { withRouter } from 'react-router-dom';
...

export class MyDetail extends React.Component {
...
  componentDidMount() {
    this.context.router.setRouteLeaveHook(this.props.route, () => {
      if (true)
        return 'You have unsaved information, are you sure you want to leave this page?'
    })
  }

render() {
...
}
...
MyDetail.propTypes = {
  ...
  route: PropTypes.object,
};

MyDetail.contextTypes = { router: PropTypes.object };

const MyDetailForm = reduxForm({
  validate,
  form: 'My_detail',
  enableReinitialize: true,
})(MyDetail);
const ConnectedMyDetail = connect(mapStateToProps)(MyDetailForm);
export default withRouter(ConnectedMyDetail);
4

0 回答 0