0

我有一个奇怪的问题让我摸不着头脑。我正在尝试从 api 获取数据并将返回的数据传递给带有 React Router 的组件(作为道具)。但是返回的数据是“未定义的”。

MyRoutes.js:

let refreshAvailability = (profile_index) => {
    let fetch = new DataFetch();
    fetch.get(`/info/${profile_index}`, (err, res) => {
        let username = res[Object.keys(res)[0]].username;
        if(username !== undefined) {
            setTimeout(() => {return getStatus(username)}, 0);
            setInterval(() => {return getStatus(username)}, 10000); //Refresh every 10 seconds
        }
    });
}

let getStatus = (username) => {
    let userStatus = new userStatus();
    userStatus.getStatus(available => {
        //If i place console.log(available) here it will print the result, but when i return it, its undefined.
        return available;
    });
}

const myRoutes = () => (
  <BrowserRouter>    
            <Route exact path='status/:profile_index' render={(props) => (
                <Status {...props} available={refreshAvailability} />
            )}/>
  </BrowserRouter>
);

export default MyRoutes;

状态.js:

componentDidMount(){
    let userIndex = this.getUserIndex();
    let userStatus = this.props.available(userIndex);

    console.log(userStatus); //This prints undefined
}

不知何故,问题似乎出在 getStatus 函数中。如果我在那里记录 api 的输出,我可以看到它在状态组件中记录,但是当我返回它时,它返回“未定义”。

这让我想到了一个问题,React 如何使用 return 语句作为道具来处理函数?它与传递函数而不返回有什么不同吗?还是我忽略了代码中的内容?

4

0 回答 0