我想问一下,为什么当我参加onClick项比赛时,我的状态没有改变.我之前搜索过,我需要在构造函数中绑定onClick函数,但状态仍然没有更新.

这是我的代码:

import React from 'react';
import Grid from 'react-bootstrap/lib/Grid';
import Row from 'react-bootstrap/lib/Row';
import Col from 'react-bootstrap/lib/Col';
import BoardAddModal from 'components/board/BoardAddModal.jsx';    
import style from 'styles/boarditem.css';

class BoardAdd extends React.Component {
    constructor(props) {
        super(props);    
        this.state = {
            boardAddModalShow: false
        };    
        this.openAddBoardModal = this.openAddBoardModal.bind(this);
    }

    openAddBoardModal() {
        this.setState({ boardAddModalShow: true }); // set boardAddModalShow to true

        /* After setting a new state it still returns a false value */
        console.log(this.state.boardAddModalShow);   
    }

    render() {    
        return (
            <Col lg={3}>
                <a href="javascript:;" 
                   className={style.boardItemAdd} 
                   onClick={this.openAddBoardModal}>
                    <div className={[style.boardItemContainer,
                                     style.boardItemGray].join(' ')}>
                        Create New Board
                    </div>
                </a>
            </Col>
        );
    }
}

export default BoardAdd

推荐答案

这回电话真是一团糟.只需使用async await即可:

async openAddBoardModal(){
    await this.setState({ boardAddModalShow: true });
    console.log(this.state.boardAddModalShow);
}

Reactjs相关问答推荐

Shadck/ui Select -当用户 Select 项目时更改状态

react 下拉菜单任务

Reactjs中的chartjs和reaction-chartjs-2的问题

错误./src/TopScroll.js 31:21-31导出';(作为';随路由导入)在';Reaction-Router-Dom';中找不到

React:关于useEffect钩子如何工作的困惑

左边框不在图表中显示

如何使用TouchStart/TouchEnd在Table ReactJS中交换位置?

svg每条路径上的波浪动画

如何在我的 React 应用程序中仅显示我的 Register 组件

如何更新 FunctionComponentElement 的 props

在React中使用if条件时如何更改Tailwind中元素的文本 colored颜色

useEffect 内的 onClick 和 addEventListener 之间的 click 事件顺序差异

数据表格组件需要所有行都具有唯一的ID属性.或者,您可以使用getRowId属性.

在遵循 react-navigation 的官方文档时收到警告消息

Recharts 笛卡尔网格 - 垂直线和水平线的不同样式

Cypress 组件测试不渲染react 组件(但它的内容)

React js中不记名令牌中的空间问题

使用 React.UseEffect 从 api 获取但我的清理返回不起作用

React 中的 Slide API Mui 在开始而不是结束时触发侦听器

React Router 6.4CreateBrowserRouter子元素不显示