# React-study-byOwner

**Repository Path**: sy0451/react-study-by-owner

## Basic Information

- **Project Name**: React-study-byOwner
- **Description**: 根据官方文档学习里面的demo
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-03-25
- **Last Updated**: 2025-03-25

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 在代码渲染组件中，进行页面交互

onSquareClick = {handleClick(0)}    会报错，说是重复渲染
handleClick()中的括号会立即调用函数，导致每次执行该函数不是在事件发生时。
onClick = {handleClick}只会在事件触发式调用

## ！函数引用和函数调用的区别

    函数引用是将函数作为值传递，
    函数调用则是立即执行
    
`这里箭头函数的作用是：延迟执行。传递的是函数本身，需要等待事件触发时才执行。`

```javascript
  return (
  <>
    <h2>{status}</h2>
    <div className="board-row">
      <Sequare value={squares[0]} onSquareClick={() => handleClick(0)} />
      <Sequare value={squares[1]} onSquareClick={() => handleClick(1)} />
      <Sequare value={squares[2]} onSquareClick={() => handleClick(2)} />
    </div>
  <>
 ```