반응을 사용하여 개체 배열을 다른 구성 요소로 전달

반응을 사용하여 개체 배열을 다른 구성 요소로 전달

어레이 라인 소품을 하위 구성 요소에 전달할 수 있는 방법이 있는가?<Link to="/abc/results">- 결과 구성요소는 데이터를 렌더링하기 위해 주 구성요소의 배열이 필요하다.이거 어떻게 하는 거야?단일 ID 전송에 대한 다른 논의가 있다. - URL에도 추가되지만 - 내 질문은 링크와 함께 n개의 개체 수 배열처럼 데이터를 전송할 수 있는 방법이 있을까?

업데이트됨: client/index.js

import React from 'react';
import { render } from 'react-dom';
import { BrowserRouter as Router } from 'react-router-dom';
import { Provider } from 'react-redux';
import store from '../components/redux/store';
import App from '../components/app/app';

render((
  <Provider store={store}>
    <Router>
      <App />
    </Router>
  </Provider>
), document.getElementById('root'));

server.js:

export default function (req, res, next) {
  const store = createStore(reducers, {}, applyMiddleware(thunk));
  let foundPath = null;
  let { path, component } = routes.routes.find(
    ({ path, exact }) => {
      foundPath = matchPath(req.url,
        {
          path,
          exact,
          strict: false
        }
      );
      return foundPath;
    }) || {};
  if (!component) {
    component = {};
  }
  if (!component.fetchData) {
    component.fetchData = () => new Promise((resolve, reject) => resolve());
  }
  component.fetchData({ store, params: (foundPath ? foundPath.params : {}) }).then(() => {
    const state = store.getState();
    const preloadedState = JSON.stringify(state).replace(/</g, '\\u003c');
    const context = {};

    const html = ReactDOMServer.renderToStaticMarkup(
      <Provider store={store} >
        <Router location={req.url} context={context} >
          <App />
        </Router>
      </Provider>
    );

....

 <Link to={{ pathname: '/abc/testing/results', state: { results: resultsArray } }}> Click </Link>

경로: ....

routes: [

      {
          path: '/abc/testing/results',
          component: Results,
          exact: true
        },
{..},
{..},
]

......

당신은 그것을 사용할 수 있다.location통과를 반대하다state응답 라우터 V4.당신의Link주시겠습니까?

<Link to={{
  pathname: '/abc/results',
  state: { myArrayVariableName: myArrayVariable}
}}/>

문서에 있는 추가 정보

그리고 안에Results다음과 같이 값에 액세스하십시오.this.props.location.state.myArrayVariableName

//first component
<Link
    to={{
      pathname: `/trainer`,
      state: {
        instructor_id: ["abc","bcd"],
      },
    }}>
    click here
  </Link>
  



//second component to fetch data

console.log(this.props.history.location.state.instructor_id);

참조URL: https://stackoverflow.com/questions/47245664/pass-an-array-of-objects-to-another-component-using-link-in-react