使用React从页面导入数据

Question

我有一个Web应用程序正在响应，并且我有两个注册页面，一个用户，下一个用于注册项目的用户，我需要获取在上一页中注册的用户ID，才能在下一个项目中注册该项目。页面。

但是我无法导入id，因为它在函数内部，所以我无法获取

export default function Register({ history }) {
    const [username, setUsername] = useState('');
    const [email, setEmail] = useState('');
    const [passwd, setPasswd] = useState('');

    async function handleSubmit(e) {
        e.preventDefault();

        const response = await api.post('/createUser',  {
            username, email, passwd,
        });

        console.log(response.data);
        const { _id: _idUser } = response.data;

        history.push(`/freela/${_idUser}`);
    }

我正在尝试这样导入

import { _idUser } from './Register';

他向我返回此错误：

路线：

Answer 1

我认为您正在使用react-router或react-router-dom进行导航。

对于这两个库，您都可以将数据作为下一个组件的道具传递给您-

history.push( / freela / $ {_ idUser} , _idUser);

，在您的下一个组件中，您可以通过

进行访问

props.location.state

但是最好的方法是从参数中获取它，因为您的URL中有该ID。

通过使用useParams中的react-router-dom挂钩；

链接到示例-https://reacttraining.com/react-router/web/example/url-params

Answer 2

快速建议：由于您要在idUser中推送history.push('/freela/${_idUser}，因此可以从URL中提取_idUser