Question

我已经使用React-Redux和React-router-dom（v4）构建了一个应用程序。在我的整个应用程序中，我使用react-router-dom组件来（1）导航到另一页，并且（2）传递道具。这在Chrome中有效，但在FF中失败，出现this.props.location.state undefined错误。

<Link to={{
              pathname: 
`/facilities/permits/permitplanapproval/${this.props.id}`,
              state: { facility: facility }
            }}><Button className="btn btn-light edit">Create</Button>

我发现这篇帖子（https://github.com/ReactTraining/react-router/issues/6499）是FF问题。该规则指出“必须没有交互式内容的后代”，因此，如果我了解这一点，则其说出的按钮不能传递内容，而只能执行导航或提交/重置等操作。

因此，我从链接中删除了按钮，并尝试了：

  <Link to={{
              pathname: 
`/facilities/permits/permitplanapproval/${this.props.id}`,
              state: { facility: facility }
            }}>Create</Link>

但是我得到了相同的结果。

我也尝试过仅使用一个按钮

<Button className="btn btn-light edit"
                  onClick={() => 
history.push(`/facilities/permits/permitplanapproval/${this.props.id}`, 
{facility: this.props.facility} )}    
                  >Create</Button>

PACKAGE.JSON文件（供参考）

 "dependencies": {
"axios": "^0.18.0",
"bootstrap": "^4.3.1",
"history": "^4.7.2",
"moment": "^2.24.0",
"react": "^16.4.2",
"react-bootstrap": "^1.0.0-beta.5",
"react-csv": "^1.1.1",
"react-dom": "^16.4.2",
"react-openidconnect": "^1.1.0",
"react-redux": "^5.0.7",
"react-router-dom": "^4.3.1",
"react-scripts": "1.1.5",
"react-table": "^6.10.0",
"react-widgets": "^4.4.10",
"redux": "^4.0.0",
"redux-form": "^7.4.2",
"redux-form-validators": "^2.7.5",
"redux-oidc": "^3.1.2",
"redux-thunk": "^2.3.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
},
"devDependencies": {
"redux-logger": "^3.0.6"
}

在Firefox中未读取链接react-router-dom通过状态

0 个答案: