Quantcast
Channel: Forum Pasja Informatyki - Najnowsze pytania bez odpowiedzi
Viewing all articles
Browse latest Browse all 21942

React Router kliknięcie w link nie działa a odświeżenie z docelowym adresem tak

$
0
0

Mam dziwny problem. Nie zauważyłem kiedy przestał mi działać klik w linki z Route (<Link to="">). Otóż adres się zmienia ale komponent zostaje taki jaki był. Natomiast jeśli odświeżę stronę ze zmienionym adresem to załaduje się docelowy komponent (ten, który powinien).

Ktoś zna rozwiązanie?

app.js

import React from "react";
import ReactDOM from "react-dom";
import { Provider } from 'react-redux';
import { Router, Route } from 'react-router';
import createHistory from 'history/createBrowserHistory';
import axios from 'axios';

import App from './components/App/App';
import Tasks from './components/Tasks/Tasks';
import Projects from './components/Projects/Projects';
import store from './store';

const app = document.getElementById('app');
const history = new createHistory();

axios.defaults.headers.common['X-CSRF-TOKEN'] = document.querySelector('meta[name="csrf-token"]').getAttribute('content');

ReactDOM.render(
    <Provider store={store}><Router history={history}><App><Route path="/app" exact component={Tasks} /><Route path="/app/projects" component={Projects} /></App></Router></Provider>,
    app);

 

i komponent App:

import React from 'react';
import { connect } from 'react-redux';

import Navbar from '../Navbar/Navbar';
import Sidebar from '../Sidebar/Sidebar';
import Flash from '../Flash/Flash';
import { getAllProjects } from '../../actions/projectsActions';
import { getAllTasks } from '../../actions/tasksActions';

@connect((store) => {
    return {
        projects: store.projects
    }
})

export default class App extends React.Component {
    constructor(props) {
        super(props);

        this.props.dispatch(getAllProjects());
        this.props.dispatch(getAllTasks());
    }

    render() {
        return (
            <div><Navbar /><Sidebar /><main className="app">
                    { this.props.children }</main><Flash /><div className="backdrop"></div></div>
        )
    }
}

 

Jeśli potrzeba więcej informacji to dopiszę jak będę wiedział co potrzeba. 

Wszystkie pliki są dostępne na GitHubie - plik js w odpowiednim katalogu

Za wszelką pomoc z góry dziękuję.


Viewing all articles
Browse latest Browse all 21942

Trending Articles


TRX Antek AVT - 2310 ver 2,0


Автовишка HAULOTTE HA 16 SPX


POTANIACZ


Zrób Sam - rocznik 1985 [PDF] [PL]


Maxgear opinie


BMW E61 2.5d błąd 43E2 - klapa gasząca a DPF


Eveline ➤ Matowe pomadki Velvet Matt Lipstick 500, 506, 5007


Auta / Cars (2006) PLDUB.BRRip.480p.XviD.AC3-LTN / DUBBING PL


Peugeot 508 problem z elektroniką


AŚ Jelenia Góra