prop 更改时，无状态组件不会重新渲染

Question

此代码在一个环境中运行良好：

const RenderAuthors = ({ fields }) => {
  const addAuthorField = () => { fields.push({}) }
  if (fields.length === 0) {
    addAuthorField()
    console.log("Enter here")
  }
  console.log("Fields************:" + fields.length)
  return (
    <ul style={style.authorsList}>
      {fields.map((member, index) =>
        <li key={index}>
          <Field
            name={`${member}.firstName`}
            type='text'
            component={RenderField}
            dataSource={nameList}
            hintText='Introduce el nombre del autor'
            muiComponent={AutoComplete}
            floatingLabelText='Nombre'
            openOnFocus={true}
            filter={MUIAutoComplete.fuzzyFilter}
          />
          <Field
            name={`${member}.lastName`}
            type='text'
            component={RenderField}
            dataSource={surnameList}
            hintText='Introduce el apellido del autor'
            muiComponent={AutoComplete}
            floatingLabelText='Apellido'
            openOnFocus={true}
            filter={MUIAutoComplete.fuzzyFilter}
          />
          <FloatingActionButton mini={true} style={style} onClick={() => fields.remove(index)} >
            <Delete />
          </FloatingActionButton>
          <FloatingActionButton mini={true} onClick={addAuthorField} >
            <PersonAdd />
          </FloatingActionButton>
        </li>
      )}
    </ul>
  )
}

字段为空，执行addAuthorField函数。当我调试我的代码（Chrome 调试工具和 webpack）时，你看到 RenderAuthors 被重新渲染（我猜是因为 fields prop 已经改变）并且用字段渲染。我的 console.log 是：

Enter here
Fields************:0
Fields************:1

在另一个环境中（相同的 React，redux-form，但不是 webpack，Babel 中的小差异），当我调试代码时：

addAuthorField 已执行，但未重新呈现。我的 console.log 是：

Enter here
Fields************:0

知道如何猜测错误在哪里吗？

Answer 1

加油！我忘记了另一个环境中的reducer！

prop 更改时，无状态组件不会重新渲染

Stateless component is not rerendering when prop changes

reactjs

redux-form