Search code examples
meteorreactjsflow-router

Meteor Flow Router React: I am passing a component as a prop, and I want to include a prop in that component

See this code:

authenticatedRoutes.route( '/study/:studyId/study_settings', {
  name: 'study_settings',
  action(params, queryParams) {
    console.log(queryParams);
    Session.set('studyId', params.studyId);
    mount( Default, { yield: <PageContainer pageName='Study Settings' page={<StudySettings />}/>  } );
  }
});

As you can see the page prop? in the mount function? I am passing <StudySettings /> component

well I want to pass a prop into this component

but when I try <StudySettings queryPage=queryParams.subPage /> I get compile error.

How can I do this?

Solution

  • When you want to pass a prop to a ReactJS Component that is a variable you need to use {} so in your case you need to do something like this

    <StudySettings queryPage={ queryParams.subPage } />

    Let me know if you have anyother questions!