Почему mapStateToProps не позволяет корректно отображать массив props?

Question

Так что, в принципе, есть кое-что, что можно сделать довольно легко с помощью Vanilla React, я думаю, просто передавая реквизиты непосредственно дочернему компоненту. Здесь я проделал то же самое с Redux, и по какой-то причине массив prop не будет отображаться правильно. Это очень маленький компонент. В его родительском массиве добавляется каждый раз, когда человек нажимает «Enter», добавляя тег в массив тегов. Затем они должны отобразить на div, но это не происходит. Пожалуйста, дайте мне знать, если я делаю что-то не так здесь.

import React, { Component } from 'react';
import './index.css';
import { connect } from 'react-redux';

const mapStateToProps = state => {
    console.log(state.pertinentVariableArray)
    return { pertinentVariableArray:state.pertinentVariableArray };
}

class TagPanneau extends Component {

    render(){
        return(
            <div id="tagPanneauItself">
                {
                this.props.pertinentVariableArray.map((element,index)=>
                    <div className="tagElement" key={index}>{element}</div>
                )
                }
            </div>
        )
    }
}

const ActualTagPanneau = connect(mapStateToProps)(TagPanneau);
export default ActualTagPanneau;

Answer 1

Я думаю, что вы должны проверить this.props.pertinentVariableArr перед использованием карты. Beacause Если уместно VariableArr, может undefined. Предложить:

{
  this.props.pertinentVariableArray&& 
  this.props.pertinentVariableArray.map((element,index)=>
       <div className="tagElement" key={index}>{element}</div>)
}

Answer 2

Я разобрался, если кто-то сталкивается с подобной проблемой. Это в основном произошло, потому что я пытался передать копию массива с добавленным к нему элементом к редуктору, вместо того чтобы использовать шаблоны неизменяемости Redux, такие как использование операции распространения [... state.array, action.payload], в основном диспетчеризующейдействие с самим значением, которое ничего не помещает в массив компонента.