Why this setState call does not trigger rendering? - reactjs

Question

I have made a small treeview component, which gets a json file with the structure and should render the treeview.
The json is correct, the promise on the constructor is resolved correctly, but the render is not called after the setState inside the constructor.
I´ve tried to read similar questions, but no success.
export default class Tree extends Component<ITreeProps, ITreeState> {
public constructor(props: ITreeProps, state: ITreeState) {
super(props, state);
Tree.GetJsonStructure(props.Path).then(response => {
this.setState({
data : JSON.parse(response)
});
console.log(response);
});
}
public static GetJsonStructure(jsonPath: string): Promise<string>{
return new Promise((resolve, reject) => {
axios.get(jsonPath, { responseType: 'arraybuffer' }).then(response => {
if (response.status !== 200) {
// handle error
reject("FAIL!");
}
var buf = new Buffer(response.data);
//var buf = Buffer.concat(response.data);
var paki = pako.inflate(buf);
var decoder = new encoding.TextDecoder();
var stringo = decoder.decode(paki);
resolve(stringo);
});
});
}
public render(): React.ReactElement<ITreeProps> {
console.log("RENDERINGGGG");
console.log(this.state)
if(!this.state || !this.state.data || this.state.data.length == 0 ){
return <div></div>;
}
const data = this.state.data;
if (!data || data.length == 0)
console.log("No properties set for the application");
return (
<div className={styles.ToolboxLinkPanel}>
{
data.map(node => (
<TreeNode key={node.key} label={node.label} children={node.nodes} isOpen={true} ></TreeNode>
))
}
</div>
);
}
}

Answer 1

You need to call your api method inside componentDidMount and not in the constructor:
componentDidMount() {
Tree.GetJsonStructure(props.Path).then(response => {
this.setState({
data: JSON.parse(response)
});
console.log(response);
});
}
As to why it's the place to make api calls, the official documentation elaborates (emphasis added):
componentDidMount() is invoked immediately after a component is
mounted (inserted into the tree). Initialization that requires DOM
nodes should go here. If you need to load data from a remote endpoint,
this is a good place to instantiate the network request [...] It will trigger an extra rendering, but it will happen before the browser updates the screen..