Why is componentDidMount being ignored?

Question

React

There is a class that we get into when routing, it enters constructor and render (and 2 times each), but does not enter methods like componentDidMount, componentDidUpdate, etc. This does not result in data. Why is that?

import React from "react";
import {connect} from "react-redux";
import {loadOneFoodPost} from "../../redux/food-items-reducer";

class FoodPage extends React.PureComponent {

    constructor(props) {
        console.log('constructor')
        super(props);
    }

    componentDidMount() {
        console.log('componentDidMount')
        this.props.loadOneFoodPost(this.props.match.params.id)
    }


    componentDidUpdate(prevProps, prevState, snapshot) {
        console.log('componentDidUpdate')
        if (prevState.id !== this.props.match.params.id) {
            this.props.loadOneFoodPost(this.props.match.params.id)
        }
    }

    render() {
        const {post, author, anotherPosts} = this.props
        console.log('render')
        return(
            <>
                <h2>{post.title}</h2>
            </>
        )
    }
}

const mapStateToProps = (state) => ({
    post: state.foodItems.foodPost[0],
    author: state.foodItems.authorInfo[0],
    anotherPosts: state.foodItems.foods
})

export default connect(
    mapStateToProps, {loadOneFoodPost}
)(FoodPage)

Answer 1

The fact that console.log worked twice in render does not mean that the component was re-rendered. These are the nuances of how react works in a development build. Therefore, rerenders need to be debugged through the react dev tools profiler.
componentDidMount is only called once per component instance.
If componentDidUpdate is not called, then there was no redraw.