Ошибка типа: this.props.produtos является нулевым в проекте React Filter?

Question

Я работал над проектом электронной коммерции, там я передаю некоторые продукты (продукты) через Redux на страницу продуктов, но я пытался отфильтровать его с помощью .filter (), и он продолжает выдавать мне эту ошибку " Ошибка типа: this.props.produtos имеет значение null ". Если я не использую Filter (), мои продукты отображаются правильно, но без фильтрации.

вот код (вы можете найти .filter сразу после рендера ()

class Produtos extends Component {

    loadProdutosHandler() {
        if (!this.props.produtos) {
            developmentServer.get('jogos')
                .then(response => {
                    this.props.updateProdutosHandler(response.data.data);
                });
        }
    }

    componentDidMount() {
        this.loadProdutosHandler();
    }

    componentDidUpdate() {
        this.loadProdutosHandler();
    }

    produtoClickedHandler = (id) => {
        if (this.props.showSidebar) {
            this.props.sidebarChangedHandler(false);
        }

        this.props.history.replace({ pathname: this.props.match.url + '/' + id });
    }

    render() {


        const key = 'xbox';
        let produtos = <Loader />;

        if (this.props.produtos.filter(produtos => 
            this.props.produtos.map(produtos => this.props.produtos.plataforma))
        )
         {
            produtos =
                <div className={classes.Produtos}>
                <Banner src={img} />
                    <div className={classes.Formata}>
                        <SideBar />
                        <section className={classes.SectionProduto}>
                            <ListaCatalogo produtos={this.props.produtos}
                                url={this.props.match.url}
                                clicked={this.produtoClickedHandler} />
                        </section>
                    </div>
                </div>
        }

        return produtos;
    }
}

const mapStateToProps = state => {
    return {
        showSidebar: state.layoutRdc.showSidebar,
        produtos: state.produtosRdc.produtos
    }
}

const mapDispatchToProps = dispatch => {
    return {
        sidebarChangedHandler: (value) => dispatch(actionCreators.showSidebar(value)),
        updateProdutosHandler: (value) => dispatch(actionCreators.updateProdutos(value))
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(Produtos);

Answer 1

Может быть, produtos пусто при первом отображении вашего представления! Посмотрите, где вы определяете produtosRdc, и если produtos значение по умолчанию null, замените его на [].