javascript - JSX-JavaScript插入/奇怪的参数？

大家好，我在React.js尝试了一下，我在JSX中找到了一个事件监听器的例子。

import React from 'react';
import ReactDOM from 'react-dom';

function makeDoggy(e) {
  // Call this extremely useful function on an <img>.
  // The <img> will become a picture of a doggy.
  e.target.setAttribute('src', 'https://s3.amazonaws.com/codecademy-content/courses/React/react_photo-puppy.jpeg');
  e.target.setAttribute('alt', 'doggy');
}

const kitty = (
    <img
        src="https://s3.amazonaws.com/codecademy-content/courses/React/react_photo-kitty.jpg"
        alt="kitty"
        onClick={makeDoggy}
     />
);

ReactDOM.render(kitty, document.getElementById('app')); */

现在。我试图了解这里的一切。我注意到JSX Event-Lsiteners是用Camelcase编写的，而不是常规Javascript。并且{}用于将Javascript插入JSX，但令我困惑的一件事（可能是因为我很累：P）是makeDoggy(e)在被称为{makeDoggy}时没有通过任何东西吗？！我有点困惑，它仍然如何工作？target.setAttribute与它有关吗？

最佳答案

当makeDoggy（e）称为{makeDoggy}时，它没有通过任何内容吗？


onClick={makeDoggy}不调用makeDoggy。它只是将对makeDoggy的引用传递给onClick处理程序。当发生点击事件时，makeDoggy将由react的事件处理代码调用，并传入事件对象。

如果将其更改为{makeDoggy（'something'）}，它将立即调用makeDoggy，然后获取返回值，然后将其传递给onClick。

关于javascript - JSX-JavaScript插入/奇怪的参数？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/53656292/