Fullstackopen 2020 Part1 笔记

Part 1

React 函数组件

const Hello = (props) => {
  return (
    <div>
      <p>Hello {props.name}</p>
    </div>
  );
};
<Hello name="Maya" age={26 + 10} />;

state hook

当状态修改函数如(setCounter) 被调用时, React 会重新渲染该组件

import React, { useState } from "react";
import ReactDOM from "react-dom";

const App = () => {
  const [counter, setCounter] = useState(0);

  return (
    <div>
      <div>{counter}</div>
      <button onClick={() => setCounter(counter + 1)}>plus</button>
      <button onClick={() => setCounter(0)}>zero</button>
    </div>
  );
};

ReactDOM.render(<App />, document.getElementById("root"));

debug

© 2025 · Built with Gatsby