将箭头函数转换为React组件中的“普通”函数表达式

Ste*_*ous 2 javascript reactjs arrow-functions react-component

我想将此反应组件中的箭头样式函数(在onChange处)更改为普通函数。我是一个初学者,对我来说,同时查看两个版本会很有帮助,因为我很难理解新的箭头函数语法。

应该有可能,但是下面的“使用”普通函数会怎么样?

import React from "react";

function Input1(props) {
  //console.log(props)
  return (
    <div>
      <input
        onChange={event => props.handleChange("email", event.target.value)}
      />
    </div>
  );
}

export default Input1;
Run Code Online (Sandbox Code Playgroud)

小智 5

import React from "react";

function Input1(props) {
  //console.log(props)

  function onChange(event) {
    props.handleChange("email", event.target.value)
  }

  return (
    <div>
      <input
        onChange={onChange}
      />
    </div>
  );
}

export default Input1;
Run Code Online (Sandbox Code Playgroud)