useRef()

useRef()可以用来绑定元素节点和保存变量

import React, { useRef, useState } from 'react'

export default function UseRef() {
    const index = useRef(0)
    const myRef = useRef()
    const [val, setVal] = useState(0)
    // const te = myRef.current.value
    return (
        

            {/* 点击按钮后，控制台输出增加，但页面上的显示并未变化 */}
            {/* 在使用useState后,点击按钮调用setValue触发页面渲染，index的值也更新了 */}
            {/* 说明useRef可以存储变量，不会因为页面的渲染而重新赋值为0 */}
            {/* 将ref绑在元素节点上可以获得到对应的DOM元素 */}
            index:{index.current}
value:{val}

            
             {
                index.current++
                setVal(myRef.current.value)
                console.log(index.current)
                console.log('输入框的值：', myRef.current.value)
                myRef.current.value = ''

            }}>jia
            {/* {myRef.current.value} */}
            {/* {te} */}

        
    )
}