ReactJS राउटर V4 history.push

Question

पर काम नहीं कर रहा है मैंने RAID Router V4 पर अपग्रेड किया है और अब history.push विधि से संघर्ष कर रहा है।

मैं एक index.js फ़ाइल है:

import React from "react"; 
import { render } from "react-dom"; 
import { BrowserRouter, Route } from 'react-router-dom'; 
import createBrowserHistory from 'history/createBrowserHistory'; 

const history = createBrowserHistory(); 

import { Main} from "./components/Main"; 
import { About } from "./components/About"; 
import { Cars} from "./components/Cars"; 


class App extends React.Component { 

render() { 
    return (
     <BrowserRouter history={history}> 

      <div> 
       <Route path={"/"} component={Main} /> 
       <Route path={"/cars"} component={Cars}/> 
       <Route path={"/about"} component={About}/> 
      </div> 
     </BrowserRouter> 
    ) 
    } 
} 

render(<App/>, window.document.getElementById("app")); 

और फिर मैं एक और फ़ाइल, मैं जहां एक सरल जोड़ा जो इस तरह दिखता है एक निश्चित पृष्ठ पर वापस जाने के लिए है:

import React from "react"; 
import createBrowserHistory from 'history/createBrowserHistory'; 

const history = createBrowserHistory(); 

export class Cars extends React.Component { 
    navigateBack() { 
    history.push('/') 
    } 

    render() { 
    return(
     <div> 
      <h3>Overview of Cars</h3> 
      <p>Model: </p> 
      <button onClick={this.navigateBack} className="btn btn-primary">Back</button> 
     </div> 
    ) 
    } 
} 

तो , मैं यह नहीं समझ सकता कि यहां क्या गलत हो रहा है। जब मैं बटन पर क्लिक करता हूं, तो URL / में बदल जाता है लेकिन यह सब कुछ है। क्या कोई ऐसा व्यक्ति है जो मेरी मदद कर सकता है?

संपादित

मुझे पता चला है कि यह काम करता है जब मैं यह कर:

this.props.history.push('/home') 

और

<button onClick={this.onNavigateHome.bind(this)} 

लेकिन यह किसी भी तरह गलत लगता है ??

जब मैं

this.context.history.push('/home') 

मैं Cannot read property 'context' of null लेकिन क्यों मिलता है ?? क्या मेरा <BrowserRouter> सेटअप गलत है ??

वैसे भी, मदद :)

Answer 1

आप this.context.history.push('/cart');
बाहर की जांच के लिए अधिक जानकारी के लिए इन पदों का उपयोग करने के v4 के साथ

के लिए धन्यवाद:

How to push to History in React Router v4?

history.push not working when using BrowserRouter

Answer 2

आपके पास {withRouter} from 'react-router-dom' आयात करने और अपनी कक्षा को इस तरह से निर्यात करें

export default withRouter(Cars)

Answer 3

अपने BrowserRouter को जोड़ने forceRefresh = {सच} का प्रयास करें।

<BrowserRouter forceRefresh={true}>