为了账号安全,请及时绑定邮箱和手机立即绑定

类型错误:无法为我的 todoli 读取未定义的属性“推送”

类型错误:无法为我的 todoli 读取未定义的属性“推送”

喵喔喔 2021-09-17 17:09:14
我试图让我的待办事项列表在页面上显示我的工作,但它不想显示所有这些错误。我希望任务的用户输入显示为一个块 Cant 似乎弄清楚出了什么问题我查看了文本类型但那是正确的我不知道内容/用户输入是否没有被正确读取为字符串或什么.class App extends Component {  constructor(props) {      super(props);      this.state = {          noteText: "",          notes: []      };  }  updateNoteText(noteText) {      this.setState({ noteText: noteText.target.value });  }  addNote() {      if (this.state.noteText === "") {          return;      }      let notesArr = this.notes;      notesArr.push(this.state.noteText);      this.setState({ noteText: "" });      this.textInput.focus();  }  handlekeyPress = event => {      if (event.key === "Enter") {}  };  deleteNote(index) {      let notesArr = this.state.notes;      notesArr.splice(index, 1);      this.setState({ notes: notesArr });  }  render() {      let notes = this.state.notes.map((val, key) => {          return (              <Todo key={key} text={val} deleteMethod={() => this.deleteNote(key)} />          );      });      return (          <div className="container">          <div className="header">React Todo List</div>          <div className="btn" onClick={this.addNote.bind(this)}>            +          </div>          {notes}          <input            type="text"            ref={input => {              this.textInput = input;            }}            className="textInput"            value={this.state.noteText}            onChange={noteText => this.updateNoteText(noteText)}            onKeyPress={this.handlekeyPress.bind(this)}          />        </div>      );  }}export default App;
查看完整描述

2 回答

?
至尊宝的传说

TA贡献1789条经验 获得超10个赞

您应该绑定this或使用箭头函数,并且正如@Rob 所说,您的代码中有一个小错误。

所以,只是改变这一行addNote() {addNote = () => {,并deleteNote(index) {deleteNote = (index) => {


查看完整回答
反对 回复 2021-09-17
?
慕的地8271018

TA贡献1796条经验 获得超4个赞

我认为这应该是:

 let notesArr = this.state.notes;

而不是

 let notesArr = this.notes;

字面意思是 this.notes 是未定义的。


查看完整回答
反对 回复 2021-09-17
  • 2 回答
  • 0 关注
  • 255 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号