React JS事件處理程序沒有響應

Question

我是React JS新手。 我有一個非常簡單的代碼，該代碼在應該由onClick觸發的函數中使用alert 。 但是，該事件不會在Chrome（或任何其他瀏覽器）中觸發。 我想念什么？ 我已經在Google上搜索了，並試用了代碼，但似乎無法弄清楚。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>React - Template</title>
    <script crossorigin src="https://unpkg.com/react@15/dist/react.min.js"></script>
    <script crossorigin src="https://unpkg.com/react-dom@15/dist/react-dom.min.js"></script>
    <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
</head>
<body>

<div id="container"></div>

<script type="text/babel">

    var Comment = React.createClass({

        edit: function () {
            alert('Editing comment');
        },
        remove: function () {
            console.log("Removing");
            alert('Removing comment');

        },
        render: function () {
            return (
                    <div className="commentContainer">
                        <div className="commentText">{this.props.children}</div>
                        <button onclick={this.edit} className="button-primary">Edit</button>
                        <button onclick={this.remove} className="button-danger">Remove</button>
                    </div>
            );
        }
    });


    ReactDOM.render(
            <div className="board">
                <Comment title="Blah">Blah</Comment>
            </div>
        , document.getElementById('container'));

</script>

</body>
</html>

Answer 1

它是onClick ，而不是onclick 。 參見https://facebook.github.io/react/docs/handling-events.html

React事件使用camelCase命名，而不是小寫。

React JS事件處理程序沒有響應

問題描述

1 個解決方案

解決方案1
3 已采納 2017-09-12 19:54:32

React JS事件處理程序沒有響應

問題描述

1 個解決方案

解決方案1 3 已采納 2017-09-12 19:54:32

解決方案1
3 已采納 2017-09-12 19:54:32