#reactjs #react-hooks
#reactjs #реагировать-хуки
Вопрос:
Я пытаюсь передать один объект данных на другую страницу, но я не могу получить данные на второй странице. приведенный ниже код, который я использую
Первая страница передает данные по ССЫЛКЕ
<Link to={{ pathname: `${path}/users/${organization.id}`,
data: organization
}}> <img src={config.s3Bucket "/" organization.logo} />
</Link >
Здесь я передаю объект в параметре ‘data’
Вторая страница
import React, { useState, useEffect } from 'react';
function UserList({ history, match }) {
const { path } = match;
const { id } = match.params;
const [organization, setOrganization] = useState(null);
// const { data } = this.props.location
useEffect(() => {
// console.log(location.data);
}, []); } export { UserList };
Я пробовал ‘location.data’ и ‘this.props.location’, но я не могу получить данные, пожалуйста, помогите мне решить эту проблему.
Комментарии:
1. Вы передаете это как реквизит? Я нигде этого не вижу.
2. to={{ pathname:
${path}/users/${organization.id}
, data: organization }} , здесь «организация» — это мой объект данных
Ответ №1:
Вы можете сделать это следующим образом
<Link to={{ pathname: `${path}/users/${organization.id}`, state: organization}}>
<img src={config.s3Bucket "/" organization.logo} />
</Link >
и на второй странице
import React, { useState, useEffect } from 'react';
import {useLocation} from 'react-router-dom';
function UserList({ history, match }) {
const { path } = match;
const { id } = match.params;
const [organization, setOrganization] = useState(null);
const { state } = useLocation();
useEffect(() => {
console.log(state);
}, []);
}
export { UserList };
Комментарии:
1. выдает ошибку «Не удается прочитать свойство «реквизит «неопределенного»
2. О, я забыл, вы используете hooks. проверьте это сейчас. Я отредактировал вторую страницу.
Ответ №2:
используйте withRouter
import { withRouter } from "react-router-dom"
export default withRouter(ComponentName)