无法从孩子

  • Z时代
  • 2024-01-10
  • 分类：问答

获取无法从孩子

TypeError: Object doesn't support property or method 'setState'

尝试从孩子父母设定的状态改变父母的状态。

父功能：

setSubject(id){ 
console.log(id); 
this.setState({ 
    currentSubject: id 
}); 
<Subjects authToken = {this.state.authToken} subjects = {this.state.subjects} setSubject = {this.setSubject} />

子功能：

const listSubjects = this.props.subjects.map(subject => { 
     return(<div key={subject.id}> 
        <li data-toggle="collapse" data-target={"#" + subject.id}>{subject.title}</li> 
        <div id={subject.id} className="collapse"> 
         <ul className="subject-features-list"> 
          <li onClick={() => this.props.setSubject(subject.id)}>Egzamino programa</li> 
          <li>Egzaminai pagal metus</li> 
         </ul> 
        </div> 
       </div>

我在做什么错？

回答：

简单的解决方案：

const newSetSubject= this.setSubject.bind(this) 
<Subjects authToken = {this.state.authToken} subjects = {this.state.subjects} setSubject = {this.newSetSubject} />

你为什么要这么做？

this指函数或类，其方法要调用，在特定的情况下，你从某个类采取了setSubject方法，并把它给了另一个类或函数在其自己称之为的直接范围。

在调用时，按照setSubject的实现，它期望当前作用域（这将成为你的情况下的子函数的作用域）具有setState方法。

所以问题的要点是this的范围是指子函数的范围。

考虑下面的例子：

class PersonComponent { 
    age = 21 //default case 
    render() { 
    return <div> Person's age is {this.props.getAge()}</div> 
    } 
}

情况1：

class Person { 
    name = "John Doe" 
    age = 29 
    getAge() { 
    return this.a; 
    } 
    render() { 
    return <PersonComponent getAge={this.getAge} /> 
    } 
}

在这种情况下的结果将是21，因为在PersonComponent的范围内，age设定在21 。

情况2：

class Person { 
    name = "John Doe" 
    age = 29 
    getAge() { 
    return this.a; 
    } 
    render() { 
    return <PersonComponent getAge={this.getAge.bind(this)} /> 
    } 
}

在这种情况下，结果将是Person's age is 29，因为通过使用bind你明确地创建已预先确定的范围使用的新方法。

以上是 无法从孩子 的全部内容， 来源链接： utcz.com/qa/266699.html

回到顶部