I'm trying to use the history api to push states from the portal and then use it in the app (React).
The mail state is correctly loaded by the child app. But when I navigate in it, the routing works but the rendering returns blank content.
Here is how I push the state from the portal in the index.html :
The problem is that when I click on an element, even if the redirection works and the Person component's constructor is called, the rendering doesn't work.
Here is the Person component definition :
import React from 'react';
import PropTypes from 'prop-types';
import { withRouter } from 'react-router';
class Person extends React.Component {
static propTypes = {
match: PropTypes.object
};
constructor(props){
super(props);
console.log('the selected person : ' + this.props.match.params.id);
}
render(){
return(
<div>A person</div>
)
}
}
export default withRouter(Person);
Question : Why the console.log is called but not the rendering ? is there a conflict with the single-spa lib ?
Hello,
I'm trying to use the
history
api to push states from the portal and then use it in the app (React). The mail state is correctly loaded by the child app. But when I navigate in it, the routing works but the rendering returns blank content.Here is how I push the state from the portal in the
index.html
:<a class="p-2 text-dark" onclick="history.pushState(null, 'persons', '/persons');">Persons</a>
The
single spa
loader runs my app perfectly and I land in the main route. Here is the React loaded app Router :The
PersonsList
is defined as following :The problem is that when I click on an element, even if the redirection works and the
Person
component's constructor is called, the rendering doesn't work. Here is thePerson
component definition :Question : Why the
console.log
is called but not the rendering ? is there a conflict with thesingle-spa
lib ?Regards