Reactjs this.props.commands.map不是函数

我在呈现我的道具时遇到问题。来自组件的命令可能会出现错误，这是我的

    import { getCommand } from '../../actions/commandActions';
    import { connect } from 'react-redux';

    class Command extends React.Component {
      constructor(props) {
        super(props);
        this.state = {
          commands: []
        };
      }

      componentWillMount(){
        this.props.getCommand();
        this.setState({commands: this.props.commands});
      }


      render(){
        console.log('command props.commands: ', this.props.commands);
        return (
          <table className="table table-bordered table-responsive">
            <thead>
              <tr>
                <th>Name</th>
                <th>Command</th>
                <th>Action</th>
              </tr>
            </thead>
            <tbody>
            {
              this.props.commands.map(function(commands) {
               return
               <tr>
                <td>{commands.name}</td>
                <td>{commands.command}</td>
                <td>{commands._id}</td>
               </tr>
              })
            }
            </tbody>
          </table>
        );
      }
    }

    Command.propTypes = {
      getCommand: React.PropTypes.func.isRequired,
      errors: React.PropTypes.object.isRequired
    }

    function mapStateToProps(state) {
      return{
        commands: state.commandReducer.commands,
        errors: state.commandReducer.errors
      }

    }

    export default connect(mapStateToProps, { getCommand })(Command);

我想把它渲染到我的桌子上，但我的错误是

this.props.commands.map不是函数

---

感谢您的帮助。

从您的评论来看，

this.props.commands

最初给出的是一个空对象，而不是数组。您可以更改代码以将数组作为道具返回，也可以执行检查。 还为对象指定一个唯一的键，如

{ Array.isArray(this.props.commands) && this.props.commands.map(function(commands, index) {
               return
               <tr key ={i}>
                <td>{commands.name}</td>
                <td>{commands.command}</td>
                <td>{commands._id}</td>
               </tr>
              })
            }

{Array.isArray（this.props.commands）&&this.props.commands.map（函数（命令，索引）{
返回
{commands.name}
{commands.command}
{命令。_id}
})
}

从您的评论来看，

this.props.commands

最初给出的是一个空对象，而不是数组。您可以更改代码以将数组作为道具返回，也可以执行检查。 还为对象指定一个唯一的键，如

{ Array.isArray(this.props.commands) && this.props.commands.map(function(commands, index) {
               return
               <tr key ={i}>
                <td>{commands.name}</td>
                <td>{commands.command}</td>
                <td>{commands._id}</td>
               </tr>
              })
            }

{Array.isArray（this.props.commands）&&this.props.commands.map（函数（命令，索引）{
返回
{commands.name}
{commands.command}
{命令。_id}
})
}

最初，您的

命令

是一个

对象

，如您在控制台中所示，在使用

映射创建
ui
项之前进行检查，还有一件事，每当在
循环
中动态创建
ui
时，请始终将唯一的
键
分配给包装器，尝试以下操作：

{ 
  Array.isArray(this.props.commands) && this.props.commands.map((commands,i) => { 
    return 
      <tr key={i}> 
         <td>{commands.name}</td> 
         <td>{commands.command}</td> 
         <td>{commands._id}</td> 
     </tr> 
   }) 
}

{
isArray（this.props.commands）&&this.props.commands.map（（commands，i）=>{
返回
{commands.name}
{commands.command}
{命令。_id}
}) 
}
最初，您的
命令
是一个
对象
，如您在控制台中所示，在使用
映射创建
ui
项之前进行检查，还有一件事，每当在
循环
中动态创建
ui
时，请始终将唯一的
键
分配给包装器，尝试以下操作：

{ 
  Array.isArray(this.props.commands) && this.props.commands.map((commands,i) => { 
    return 
      <tr key={i}> 
         <td>{commands.name}</td> 
         <td>{commands.command}</td> 
         <td>{commands._id}</td> 
     </tr> 
   }) 
}

{
isArray（this.props.commands）&&this.props.commands.map（（commands，i）=>{
返回
{commands.name}
{commands.command}
{命令。_id}
}) 
}
由于您无论如何都要将道具保存在状态中，您也可以映射到状态，请尝试
this.state.commands.map
也
this.props.commands.map
可能不是Javascript对象。尝试运行
this.setState（{commands:JSON.parse（this.props.commands）}）
这与
this.state.commands.map不是一个函数相同
您是否尝试使用JSON.parse进行解析，以及是否在JSON中的位置1使用immutable.jso意外标记不使用immutable jso因为您无论如何都在状态中保存道具，所以您也可以映射到状态，请尝试
this.state.commands.map
同时
this.props.commands.map
可能不是Javascript对象。尝试运行
this.setState（{commands:JSON.parse（this.props.commands）}）
这是一样的
this.state.commands.map不是函数
您是否尝试使用JSON.parse进行解析，并且您是否在JSON中的位置1使用immutable.js意外标记o未使用immutable jsapp.js:369 Uncaught TypeError:this.props.commands.isArray不是函数pp.js:369 Uncaught TypeError:this.props.commands.isArray不是大家好，谢谢你们的回答。我通过使用u.valuesIn（this.props.commands）将对象转换为数组来获得它；来自lodash（y）大家好，谢谢你们的回答。我通过使用u.valuesIn（this.props.commands）将对象转换为数组来获得它；来自lodash（y）