react后台管理系统表单页面编辑切换的时候提示，很强

    后台管理系统很常见的就是这种编辑页面，我是用antd的。因为用户没填完没点保存实际上填的数据并没有保存起来，当时想着切换的时候先存起来，点回去的时候再复原，但是考虑到可行性，不太现实，直接提示你离开就没了，要离开请随意。

  然后开始着手逻辑，领导的意思是表单里面填了东西的切换页面就要提示，当然除开保存按钮，那我赶紧去查了form的属性，直接贴代码：

写个函数传两个参数进去

// 处理编辑页面切换阻止
function handlePrompt(isEdit, isClickSave) {
  // 如果是点击保存,不经过这里逻辑，返回true
  if (isClickSave) {
    return true
  } else {
    if (isEdit) {
      let leave = window.confirm(
        '当前页面在编辑当中，切换会导致表单内容丢失，您确定要离开该页面吗?'
      )
      if (!leave) {
        return false
      } else {
        return true
      }
    } else {
      return true
    }
  }
}

然后在页面上加上这个组件，这个组件你直接import { Prompt } from 'react-router'

        <Prompt
          message={() =>
            this.handlePrompt(this.props.form.isFieldsTouched(), isClickSolutionSave)
          }
        ></Prompt>

至于第二个参数isClickSolutionSave是我直接的保存按钮修改的变量，你们换成你们的就行。

重点是这个form.isFieldsTouched()，判断是否任一输入控件经历过 getFieldDecorator 的值收集时机 options.trigger，它返回的是布尔值，大家可以去官网看看。么么哒