Reactjs 组件不符合逻辑'；改变道具后不要重新渲染

我对React Redux应用程序有一个奇怪的问题。我的一个组件在道具更改时不会重新渲染，该更改由动作“设置获胜字母”更新。github回购：

setWord.js

const initialWordState = {
  word: []
};

const setWinningLetters = (wordProps) => {
  let {word, pressedKey} = wordProps;
  for (let i = 0; i < word.length; i++) {
    if (/^[a-zA-Z]$/.test(pressedKey) && word[i].letter.toUpperCase() == pressedKey) {
      word[i].visible = true;
    }
  }
  return {word};
}

const setWord = (state = initialWordState, action) => {
  switch(action.type) {
    case 'SET_WORD': return Object.assign({}, state, getWord(action.word));
    case 'SET_WINNING_LETTERS': return Object.assign({}, state, 
 updateWord(action.wordProps));
  }
  return state;
}

export default setWord;

而在PrimaryContent.js中，会呈现赢字符和输字符

  import React from 'react';
  import {connect} from 'react-redux';
  import store from '../reducers/store';
  import Hangedman from './Hangedman';
  import AspectRatio from './AspectRatio';
  import Puzzle from './Puzzle';
  import MissedCharacters from './MissedCharacters';

  const mapStateToProps = (store) => {
    return {
      word: store.wordState.word,
      missedLetters: store.missedLettersState.missedLetters
    }
  }

  class PrimaryContent extends React.Component {
constructor() {
  super();
}


renderDisabledPuzzles(amount){
  return Array.from({length: amount}, (value, key) => <AspectRatio parentClass="disabled" />)
}

renderLetters(word) {
  return word.map(function(letterObj, index) {
    let space = (letterObj.letter==' ' ? "disabled": '')
    return(
      <AspectRatio parentClass={space} key={"letter" + index}>
        <div id={"letter" + index}>{letterObj.visible ? letterObj.letter : ''}</div>
      </AspectRatio>
    )
  }) ;
}

render() {
  let disabledCount = this.props.puzzles - this.props.word.length;
  let disabledPuzzles = this.renderDisabledPuzzles(disabledCount);
  let WinningLetters = this.renderLetters(this.props.word);

  return (
    <div className="ratio-content primary-content">
      <Hangedman/>
      <MissedCharacters missedLetters={this.props.missedLetters}/>
      <Puzzle>
        {disabledPuzzles}
        {WinningLetters}
      </Puzzle>
    </div>
  );
 }
}
export default connect(mapStateToProps)(PrimaryContent);

从“React”导入React；
从'react redux'导入{connect}；
从“../reducers/store”导入存储；
从“/Hangedman”导入Hangedman；
从“/AspectRatio”导入AspectRatio；
从“./Puzzle”导入拼图；
从“./MissedCharacters”导入MissedCharacters；
常量mapStateToProps=（存储）=>{
返回{
word:store.wordState.word，
missdletters:store.missdlettersstate.missdletters
}
}
类PrimaryContent扩展了React.Component{
构造函数（）{
超级（）；
}
renderDisabledPuzzles（金额）{
返回数组。from（{length:amount}，（value，key）=>）
}
渲染器（word）{
返回word.map（函数（letterObj，索引）{
让空格=（letterObj.letter=“”？“已禁用”：“”）
返回(
{letterObj.visible？letterObj.letter:'}
)
}) ;
}
render（）{
让disabledCount=this.props.puzzles-this.props.word.length；
设disabledPuzzles=this.renderDisabledPuzzles（disabledCount）；
让WinningLetters=this.renderLetters（this.props.word）；
返回(
{disabledPuzzles}
{赢信}
);
}
}
导出默认连接（MapStateTops）（PrimaryContent）；

MissedCharacters运行良好，而{WinningLetters}运行不正常。

---

动作“SET_MISSED_LETTERS”非常完美，而“SET_WINNING_LETTERS”只有在更新“SET_MISSED_LETTERS”时才起作用。这意味着当我按下一个或多个赢的字母时，它们将不会显示，直到我按下丢失的字母。当我按下丢失的字母时，作为丢失和获胜字母父级的组件将重新渲染。我试图从PrimaryContent的父母那里向其传递道具，但我得到了同样的结果。我试图通过访问redux store将{WinningLetters}从它自己的组件中分离出来，但它的效果更差，甚至在MissedCharacters更新时也会停止更新。您能检测出我在哪里犯了错误吗？

请提供一个示例，使用，我无法帮助您查看当前的代码库（例如，您没有提供减速机的代码）。请提供一个示例，使用，我无法帮助您查看当前的代码库（例如，您没有提供减速机的代码）.

  import React from 'react';
  import {connect} from 'react-redux';
  import store from '../reducers/store';
  import Hangedman from './Hangedman';
  import AspectRatio from './AspectRatio';
  import Puzzle from './Puzzle';
  import MissedCharacters from './MissedCharacters';

  const mapStateToProps = (store) => {
    return {
      word: store.wordState.word,
      missedLetters: store.missedLettersState.missedLetters
    }
  }

  class PrimaryContent extends React.Component {
constructor() {
  super();
}


renderDisabledPuzzles(amount){
  return Array.from({length: amount}, (value, key) => <AspectRatio parentClass="disabled" />)
}

renderLetters(word) {
  return word.map(function(letterObj, index) {
    let space = (letterObj.letter==' ' ? "disabled": '')
    return(
      <AspectRatio parentClass={space} key={"letter" + index}>
        <div id={"letter" + index}>{letterObj.visible ? letterObj.letter : ''}</div>
      </AspectRatio>
    )
  }) ;
}

render() {
  let disabledCount = this.props.puzzles - this.props.word.length;
  let disabledPuzzles = this.renderDisabledPuzzles(disabledCount);
  let WinningLetters = this.renderLetters(this.props.word);

  return (
    <div className="ratio-content primary-content">
      <Hangedman/>
      <MissedCharacters missedLetters={this.props.missedLetters}/>
      <Puzzle>
        {disabledPuzzles}
        {WinningLetters}
      </Puzzle>
    </div>
  );
 }
}
export default connect(mapStateToProps)(PrimaryContent);