问题描述

react中使用router.push("/createForm")进行路由跳转，表单创建完成后，使用router.goBack()返回页面。
创建页面可以正常返回列表页面，但是编辑页面需要调用两次router.goBack()才可以返回列表页面。
编辑页面和新增页面的跳转路由地址相同，跳转方法相同

技术栈：react+umi+dva+antd

问题解决过程

step 1

多次操作两个页面观察不同之处，
发现编辑页面的路由地址为http://localhost:8000/exposure-draft-create#
新增页面的路由地址为http://localhost:8000/exposure-draft-create
编辑页面地址后多了一个#号，第一次调用router.goBack()，#号去除，第二次调用router.goBack()正常返回了列表页面

step 2

探寻#号的来源

1. 搜索引擎搜索“router #”，无结果
2. 代码中寻找跳转编辑页面和新增页面的不同之处
3. 两个页面跳转路由地址相同（控制台打印路由均无#号），跳转方法使用了相同的函数
4. 寻找调用跳转函数的HTML
   跳转编辑页面

 <div className={
    
    styles.details}>
          <span>
            <a
              onClick={
    
    () => this.toEditPage(id, conferenceType)}
              href="#"
              style={
    
    {
    
     padding: 0 }}
            >
              编辑
            </a>
          </span>
 </div>

跳转创建页面

<div className={
    
    styles.createMeeting}>
          <Button type="button" onClick={
    
    () => this.toCreatPage()}>
            {
    
    formTestObject.buttonText}
          </Button>
</div>

问题出现原因

使用a标签添加属性href="#"跳转路由地址会加上#号

问题解决方案

去除’href="#"‘属性