未捕获的类型错误：this.state.Students.push不是函数和this.state.Students.map不是函数

What should i do?, i try many ways to solve this problem but still uncaught type error .push and .map is not function.Please help me solve this ,it will great honor for me.未捕获的类型错误：this.state.Students.push不是函数和this.state.Students.map不是函数

var InsertArray = React.createClass({ getInitialState: function() { return { Students: [], Fname: '', Lname: '', Id: '', } },
render: function() { 
    return (
     <div> 
      Firstname: 
      <input type="text" onChange={this.handleFN} value={this.state.value} /> 
      <br /> 
      Lastname : 
      <input type="text" onChange={this.handleLN} value={this.state.value}/> 
      <br /> 
      Student Id: 
      <input type="number" onChange={this.handleId} value={this.state.value} /> 
      <hr /> 
      <button type="Submit" onClick={this.handleClick}>Submit</button> 
      <button type="Submit" onClick={this.handleClickD}>Display</button> 
      <br /> 
     </div> 
     ); 
}, 

handleFN : function (value) { 
    this.setState({ 
     Fname: value 
    }); 
}, 

handleLn: function (value) { 
    this.setState({ 
     Lname:value 
    }); 
}, 

handleId: function (value) { 
    this.setState({ 
     Id: value 
    }) 
}, 
//this is where the data will be push into Student array by using push.
handleClick: function (e) { 
    e.preventDefault(); 
    var student = { 
     Fname: this.state.Fname, 
     Lname: this.state.Lname, 
     Id : this.state.Id 
    } 
    this.setState({ 
     `Students: this.state.Students.push(student)` 
    }); 
}, 
//And this handleClickD will be read all the data inside array and display.
handleClickD: function (e) { 
    e.preventDefault(); 

     <div> 
      <ul>`{this.state.Students.map(function (stud) { 
        return (<li key={stud.Id}>{stud.Fname}{stud.Lname}` 
       </li>) 
       } 
       )} 
      </ul> 
     </div> 
} }); 
ReactDOM.render(, document.getElementById('container'));

来源

2017-07-14 killer boyz

你是否曾经初始化状态？ – bmartin

是的，我已经初始化状态，但仍然在地图和推送方法中被捕获错误。 –

我还有1个问题地图（）。它不会在用户点击显示按钮后显示数据。请帮助我 –

的使用推的情况下会是这样

handleClick: function (e) { 
    e.preventDefault(); 
    var student = { 
     Fname: this.state.Fname, 
     Lname: this.state.Lname, 
     Id : this.state.Id 
    } 

    this.state.Students.push(student) 
    this.setState({ 
     Students: this.state.students 
    }); 
},

但还是明确的方式，concat()是更好的方式，因为它的非冗长，且具有较少的线路。

来源

2017-07-14 03:41:28

的Array.push将返回数组的新长度，以便之后：

this.setState({Students: this.state.Students.push(student)})

学生将是一个数字不是一个数组。

来源

2017-07-14 02:50:13 T4rk1n

你能解释更多的是因为我是新的，我不明白它的工作方式，谢谢。 –

这意味着push函数可以工作，但只会返回数组内的项数，而不会返回实际的结果。 –

使用的concat：

this.setState({Students: this.state.Students.concat(student)})

来源

2017-07-14 03:00:12 Amy

我尝试使用concat，它的工作原理，谢谢但如果我想用推我如何使它工作？ –

问题是，array.push不会返回最终阵列中，它会返回阵列的长度。

检查这个片段：

let a = [1,2,3,4,5,6]; 
 

 
let b = a.push(10); 
 

 
console.log('b = ', b); //b = 7 not [1,2,3,4,5,6,10]

为了解决您发出使用spread operator，并把新的值到数组：

this.setState({ 
    Students: [...this.state.Students, student] 
});

选中此有关传播经营者的详细信息： What do these three dots in React do?

来源

2017-07-14 03:16:36

未捕获的类型错误：this.state.Students.push不是函数和this.state.Students.map不是函数

回答

相关问题