¿Hay alguna forma de obtener este valor de "nombre" después de hacer clic en el elemento li y establecerlo en el estado de rama seleccionada usando ref?
const [selectedBranch, setSelectedBranch] = useState(null); const selectRef = useRef(); const selectDeliveryBranch = () => {}; return ( <li onClick={selectDeliveryBranch} > <p ref={selectRef}>{props.name}</p> </li>No desea utilizar ref para hacer esto, simplemente cree una devolución de llamada:
return <li onClick={()=>setSelectedBranch(props.name)}> <p>props.name</p> </li>No necesita ref.
¿Estás seguro de que necesitas usar la referencia? ¿Por qué no puedes hacer eso?
const [selectedBranch, setSelectedBranch] = useState(null); const selectRef = useRef(); return ( <li onClick={() => setSelectedBranch(props.name)} > <p ref={selectRef}>{props.name}</p> </li>