代码之家 › 专栏 › 技术社区 › Abe Miessler

如何访问事件函数内部的状态?

reactjs javascript

-1

Abe Miessler · 技术社区 · 6 年前

我有一个反应成分 using a calendar 处理一些约会的事情。我的jsx非常简单,您可以在下面看到:

  state = { 
    date: new Date(),
  };

  render() {
    return (
    //left out for the sake of brevity...
    Date: {this.state.date.toString()}
    <Calendar onChange={dateChange} activeStartDate={this.state.date} />
    //...
  )}

  function dateChange(date) {
    console.log(date)
    console.log(this)
  }

这将使我的日历和日期字符串 Date: 看起来不错。我的问题是 this 当我更改日期时总是空的。我希望能够访问 this.state.date 从 dateChange

  constructor() {
    super();
    this.dateChange = this.dateChange.bind(this)
  }

但这会返回错误 Cannot read property 'bind' of undefined .

我该如何使我的当前状态在我的 日期更改

1 回复 | 直到 6 年前

Gonzalo.- 6 年前

在类中定义它,作为类方法,不使用虚词

class yourClass extends React.Component {
    constructor(props) {
        super(props);
        this.state = { date: new Date() };
        this.dateChange = this.dateChange.bind(this);
      }

    render() {
        return (
        //left out for the sake of brevity...
        <Calendar onChange={this.dateChange} activeStartDate={this.state.date} />
        //...
        );
    }

    dateChange(date) {
        console.log(date);
        console.log(this);
    }
}

这样你就可以使用 this.dateChange = this.dateChange.bind(this) 捆绑 this

我也把状态转移到你的构造器;这就是它通常初始化的地方

Date: {this.state.date.toString()}

推荐文章

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

4 月前

Facundo Cabrera · 意外的应用程序错误!useNavigate()只能在<Router>组件的上下文中使用

5 月前

user29295031 · 如何使用react和vite覆盖Tailwinds css 4默认设计

5 月前

Gukkey · 在React中明确隐藏日期类型输入后,如果我单击父div,如何显示日期选择器?

5 月前

Luckkks · 过渡色工作不正常

5 月前

ModernEraCaveman · 如何对齐我的Bootstrap容器以适应网页的整个宽度?

5 月前

vatsal chauhan · 即使在字体预加载时,文本加载也很慢

5 月前

hasratyan · Next.js 15 API路由-动态路由中的无效GET导出错误[id]

5 月前

noblerare · Vite错误-未定义导出(SSR)

5 月前

ProfessorFinesse · 在默认表单中完成帖子请求时,“res.send”会去哪里?

5 月前