React-Hooks-useState篇

useState ： useState 会返回一对值：当前状态和一个让你更新它的函数，你可以在事件处理函数中或其他一些地方调用这个函数。它类似 class 组的 this.setState，但是它不会把新的 state 和旧的 state 进行合并。

代码自取 ： 

import React, { useState } from 'react';

const App = () => {
    /* 
        ``` 
           const [state, Set_state] = useState(1);
           console.log(state)  ==> 1
        ```
       ① 这里我们使用一个useState函数  
       ② 将userState返回的值定义给一个变量
       ③ 然后我们打印这个变量  会返回一个数组 数组格式为 [输入的默认值,改变这个默认值的方法]
       ④ 所有我们给这个函数的返回值进行结构写成这样 ==>    const [state, Set_state] = useState(1);
       ⑤ 如果我们要改变 state的值 我们可以通过 Set_state方法进行改变
                Set_state("输入想改变成的结果")
       */

    /* example <**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**> */     
    const [num, set_num] = useState(1);
    console.log(num);


    const miuns = () => {
        set_num(num => num - 1)
    }
    const add = () => {
        set_num(num => num + 1)

    }
    return (
        <>
            <h1>这是函数组件-hooks</h1>
            <p>这里通过Hooks写一个简单的计数器</p>

            <button onClick={miuns}>➖</button>
            <span>{num}</span>
            <button onClick={add}>➕</button>

        </>
    );
}

    /* example <**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**==**> */     

export default App;