Question

我正在组件中传递道具

<ReactFoldableTableAllExams patientId={this.state.patientId}/>

我需要在const中接收我的prop，但是我没有找到解决问题的方法。我在功能StudyService.FindPastStudiesByPatientId

中需要道具

const requestData = async (pageSize, page, sorted, filtered) => {
  console.log("Fetch data: sorted -> ", JSON.stringify(sorted));
  console.log("Fetch data: sorted -> ", JSON.stringify(pageSize));
  var data = await StudyService.FindPastStudiesByPatientId({

    take : pageSize,
    skip :page*pageSize,
    orderBy : sorted[0]? sorted[0].id:null,
    orderAsc : sorted[0]? !sorted[0].desc:null

  })

  return {
    rows : data.data,
    pages : 1
  }
}

export default class Example extends React.Component {
  state = {
    idStudy: 0,
    study :{},
    searchStudies :  {},
    patientId:0
  };



   fetchData(state, instance) {

    this.setState({ loading: true });

    // Request the data however you want.  Here, we'll use our mocked service we created earlier
    requestData(state.pageSize, state.page, state.sorted, state.filtered).then(
      res => {
        // Now just get the rows of data to your React Table (and update anything else like total pages or loading)

        this.setState({
          data: res.rows,
          pages: res.pages,
          loading: false
        });
      }
    );
  }
  constructor(props) {
    super(props);
    this.state = {
      study : {patient :{},prescriber:{},site:{}},
        data: [],
        pages: null,
        loading: true,
        sorted: [],
        patientId:this.props.patientId
      };
      this.fetchData = this.fetchData.bind(this);
  }

  render() {
    return (
      <div>      
        <ReactTable
          manual 
          data={data}
          pages={pages} 
          loading={loading} 
          onFetchData={this.fetchData} 
          columns={[
            {
              Header: "Information examen",
              columns: [
                {
                  Header: "Date examen",
                  accessor: "realizedDate",
                  Cell : dateCell,
                }
              ]
            }
          ]}
          defaultPageSize={20}

          className="-striped -highlight"
        />
      </div>
      </div>
    );
  }
}

Answer 1

类似的事情可以为您提供帮助：

export default class ReactFoldableTableAllExams extends React.Component {
    state = {
        idStudy: 0,
        study: {},
        searchStudies: {},
        patientId: 0
    };
    async requestData(pageSize, page, sorted, filtered) {
        const {
            parentId
        } = this.props;
        console.log("Fetch data: sorted -> ", JSON.stringify(sorted));
        console.log("Fetch data: sorted -> ", JSON.stringify(pageSize));
        var data = await StudyService.FindPastStudiesByPatientId({

            take: pageSize,
            skip: page * pageSize,
            orderBy: sorted[0] ? sorted[0].id : null,
            orderAsc: sorted[0] ? !sorted[0].desc : null

        })

        return {
            rows: data.data,
            pages: 1
        }
    }

    render() {
        return <div > < /div>
    }
}

Answer 2

根据您的代码，我认为在子组件中获取道具有问题。

父组件中的代码，您在其中输入 patientId

<ReactFoldableTableAllExams patientId={this.state.patientId}/>

您可以使用

从ReactFoldableTableAllExams中获取PatientId。

this.props.patientId

您可以使用控制台进行检查。

将道具从父级传递到Const中的组件

2 个答案: