接上篇：

問題：

如果使用 this.props.history.push('/searchs') ，它是有問題的，導致不能跳轉，因為沒有props，需要使用withRouter為這個對象添加history這個對象方可使用

這個問題的解決方案就是：

/* * 創建時間： 2019-09-19 14:42 * 作者：南宮伯賞 * 功能： 針對搜索功能的NavBar * */ import * as React from 'react'; import './searchNavBar.scss'; import { withRouter } from 'react-router-dom';class SearchNavBar extends React.Component<any, any>{constructor(props: any) {super(props)this.state = {searchValue: ''}}public render() {return (<div className='navbar'><div className='navbar-box'><div className='navbar-box-first'><div className='navbar-left'><div className='icon-back'><span onClick={this.goBacks} className="back iconfont icon-fanhui5"></span></div></div><div className='navbar-center'><div className='navbar-input'><div className='search-first'><span onClick={this.search} className="search-icon iconfont icon-sousuo5"></span></div><div className='search-second'><input onChange={(e) => this.setValue(e)} value={this.state.searchValue} className='input' type="input" placeholder='大閘蟹'/></div><div className='icon-delete'><div className='delete'><span onClick={this.deleteValue} className='deleted iconfont icon-chuyidong'></span></div></div></div></div><div className='navbar-right'><div className='icon-shares'><p className='search' onClick={this.search}>搜索</p>{/*<span className='share iconfont icon-fenxiang11'></span>*/}</div></div></div></div><div className='pt44'></div></div>);}public goBacks = () => { // 使用時候注意thisthis.props.history.goBack()}public search = () => {alert('搜索內容為空')}public deleteValue = () => { // 清空輸入框內容this.setState(() => ({searchValue: ''}))}public setValue (e:any) { //const value = e.target.valuethis.setState(() => ({searchValue: value}))} }export default withRouter(SearchNavBar)我們在使用this.props.hostory.push的時候，其實是沒有history這個對象的,需要在使用withRouter這個包裹之后，方能使用
那withRouter其實就是為對象添加一下這幾個對象的：
history: H.History;
location: H.Location<S>;
match: match<Params>;
staticContext?: C;
詳細情況可以看源碼了解，以上源代碼的問題和解決方式都在React-TS項目源碼
項目github地址： https://github.com/focusdroid/meiriyouxian_react_ts

總結

以上是生活随笔為你收集整理的react使用link跳转传递参数_React-Typescript之路由跳转（使用this.props.history.push)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。