How to understand the node in redux and react,input tags for beginners? Input.value =''why can this input be obtained?

import React from "react"
import { connect } from "react-redux"
import { addToCart } from "../actions/cart-actions"

let AddTodo = ({ dispatch }) => {
    let input = "";

    return (
        <div>
            <form
                onSubmit={e => {
                    e.preventDefault()
                    if (!input.value.trim()) {
                        return
                    }
                    dispatch(addToCart(input.value, 1, 250))
                    input.value = ""
                }}
            >
                <input
                    ref={node=> {
                        console.log(" value ==", node )
                        input = node
                    }}
                />
                <button type="submit">
                    
                </button>
            </form>
        </div>
    )
}
AddTodo = connect()(AddTodo)

export default AddTodo

in this code

<input
                    ref={node=> {
                        console.log(" value ==", node )
                        input = node
                    }}
                />

how do you understand this paragraph?

onSubmit={e => {
                    e.preventDefault()
                    if (!input.value.trim()) {
                        return
                    }
                    dispatch(addToCart(input.value, 1, 250))
                    input.value = ""
                }}

Why can I get the value of input.value in this function? How is this input.value passed

Apr.06,2021

clipboard.png

Menu