如何将一个prop值从一个Class中的函数中获取?

问题描述 投票:0回答:2

我有一个带有几个API调用的反应应用程序。我有一个组件,在组件内部,我有一个Class和类外的函数。该组件是子组件,并从其父组件接收一些道具。我的API调用是在外部函数中进行的,该函数是getSuggestionValue,并且该API调用需要来自父类的prop(jobId)。问题是我有错误Cannot read property 'projectdata' of undefined

function getSuggestionValue(suggestion) {

    const job_id = this.props.projectdata.jobId;
    const user_id = suggestion.id;

    API.post('job/assign_user', { job_id, user_id })
        .then(({ data }) => {
            console.log("success!", data)
        })
        .catch((err) => {
            console.log("AXIOS ERROR: ", err);
        })
    return suggestion.label;
}

class ProjectModal extends Component {
    constructor(props) {
        super(props);
        this.state = {
            status: null
        };
    }

    render() {

      const autosuggestProps = {
        getSuggestionValue
      };

      return(
        <div>{this.props.projectdata.jobId}
         <Autosuggest
          {...autosuggestProps}
          //other props
         />
        </div>

        //other function calls
      )
    }
}

我知道问题就在这里

const job_id = this.props.projectdata.jobId;

在getSuggestionValue函数中,但不知道如何将jobId放到API调用中。我怎样才能做到这一点?

javascript reactjs
2个回答
1
投票

你可以包装你的功能:

const getSuggestionValue = (props) => (suggestion) => {

    const job_id = props.projectdata.jobId;
    const user_id = suggestion.id;
    ...

  const autosuggestProps = {
    getSuggestionValue: getSuggestionValue(this.props)
  };

或者将projectdata作为支柱传递到嵌套组件中,并将其作为参数包含在内:

function getSuggestionValue(projectdata, suggestion) {

    const job_id = projectdata.jobId;
    const user_id = suggestion.id;
    ...

  const autosuggestProps = {
    getSuggestionValue,
    projectdata: this.props.projectdata
  };

但是在那一点上,将函数本身作为一个属性开始传递并没有多大意义。您应该考虑从Autosuggest静态引用它。


0
投票

因为你的this.props是未定义的,所以你得到的原因是无法读取未定义的属性'projectdata'。所以你能做的就是将第二个参数传递给这样的函数。

getSuggestionValue(建议,道具)

这个函数内部解析了该函数的“this”。

无论你在哪里调用getSuggestionValue函数调用如下: -

getSuggestionValue(suggestion,this.props){const job_id = props.projectdata.jobId; }

我想你在类中调用了上面的函数。

© www.soinside.com 2019 - 2024. All rights reserved.