如何根据React上的无线电值重定向

Question

我一直在尝试根据用户单击的单选按钮从登录屏幕重定向(使用"react router dom"中的导航(，我尝试过使用状态，但我不知道这是一种方法，还是有更简单的方法来做我想做的事。我在这里检查了一些其他问题，但我不知道这是否是我应该做的

以下是我迄今为止所写的内容(几乎是整个组件(：

import { TextInput, Text, View } from "react-native";
import { styles } from '../../App';
import logo from "../../logo.svg";
import Button from 'react-bootstrap/Button';
import { Route, useNavigate } from "react-router-dom";
import {useState} from 'react';
export default function LoginForm() {
const navigate= useNavigate();
const [opcion, setOpcion] = useState();
return (
<View>
<form name="LoginForm" method="GET" action="#" onSubmit={()=> navigate(opcion=="Preceptor"? "/AdministrarCurso_Preceptor": "/AdministrarCurso_Portero")}>
<label htmlFor="usuario">Nombre de Usuario</label> <br/>
<input required type="text" name="usuario" defaultValue="" /> <br/>
{/* <label htmlFor="correo">Correo Electronico</label> <br/>
<input required type="text" name="correo" defaultValue="" /> <br/> */}
<label htmlFor="contraseña">Contraseña</label> <br/>
<input required type="password" name="contraseña" defaultValue="" /> <br/> <br/>
<><input type="checkbox" />
Mantener la sesión iniciada</><br/>
<><input type="radio" name="profesion" required onChange={(e)=> setOpcion(e.target.value)} />
Portero</><br/>
<><input type="radio" name="profesion" required onChange={(e)=> setOpcion(e.target.value)}/>
Preceptor</><br/>
<input type="submit" value="Ingresar" />
{/* <Button onClick={()=> navigate('/RegisterForm')}>¿No estás registrado?</Button> */}
</form>
</View>
);
}

PS:我已经解决了以前的另一个问题，我只是不知道如何将其标记为已回答

Answer 1

您应该添加得到的value=""：

<input type="radio" name="profesion" required value="Portero" onChange={(e)=> setOpcion(e.target.value)} /> Portero
<input type="radio" name="profesion" required value="Preceptor" onChange={(e)=> setOpcion(e.target.value)} /> Preceptor

并将这部分代码CCD_ 2更改为该CCD_