无法设置onClick for React

时间:2017-12-22 18:13:30

标签: reactjs express

OnClick没有设置我的元素。我查看了每个教程,并阅读了过去一周的每个答案。仍然没有什么对我有用,我不知道为什么。

我试过这个 https://reactjs.org/docs/handling-events.html没有运气。

var React = require('react');
import { Button } from 'semantic-ui-react';

class TableDataRow extends React.Component {
    constructor(props) {
    super(props);
    this.state = {isToggleOn: true};

    // This binding is necessary to make `this` work in the callback
    this.handleClick = this.handleClick.bind(this);
  }

    handleClick() {
        console.log("handleClick");
    this.setState(prevState => ({
      isToggleOn: !prevState.isToggleOn
    }));
  }



    render() {
        // these are the same
        // const item = this.props.item;
        const {item} = this.props;

        console.log("test again");

        // this.handleClick();

        return (
            <tr>

            {Object.keys(item).map(key => <td value={key}>{item[key]}</td>)}
                <td>
                    <button onClick={(e) => console.log(e)} className="ui button edit blue" value="{item.id}">
                        <i className="edit icon"></i>
                    </button>
                </td>
                <td>
                    <button onClick={this.handleClick} className="ui button delete red" value="{item.id}">
                        <i className="delete icon"></i>
                        {this.state.isToggleOn ? 'ON' : 'OFF'}
                    </button>
                </td>
            </tr>
        );
    }
}
module.exports = TableDataRow;

编辑:两个按钮都不会对点击执行任何操作。没有日志发送到服务器(终端窗口)或​​浏览器。

Edit2:如果它有所作为我安装了React Dev工具,但它没有显示我的网站正在使用React。我想知道这是否意味着我安装了React错误...或者这些工具是否与我安装的w / e库不兼容。

0 个答案:

没有答案