Question

我正在创建一个简单的应用程序，该应用程序具有不同的API调用，直到我添加一个<Picker />组件（该组件可以更改值的状态，并且还可以更改API调用），它才能正常工作。

现在，我了解了Redux并得出结论，我必须使用中间件进行异步调用。这是我第二天试图弄清Redux，因为这似乎使我感到困惑。

以下是我在所有组件中用于获取数据的NetworkService。

import RequestService from './RequestService';

const BASE_URL = 'api.example.com/result';
const ANOT_URL = 'api.example.com/different-result';

const DATE_TODAY = new Date().toISOString();

const PICKER_VALUE = //Here should be the state from which the <Picker /> returns

class NetworkService {
    getResult(){
        let url =`${BASE_URL}/${PICKER_VALUE}`;
        return RequestService.getRequest(url)
    }

    getDifferentResult(){
        let url =`${ANOT_URL}`;
        return RequestService.getRequest(url)
    }

    getResultDate(){
        let url =`${BASE_URL}/${DATE_TODAY}`;
        return RequestService.getRequest(url)
    }
}

export default new NetworkService();

RequestService.js

class RequestService {
    async getRequest(url) {
        try {
            let response = await (await fetch(url));
            let responseJson = await response.json();
            return responseJson;
        } catch (error) {
            console.error('Error: ', error);
        }
    }
}
export default new RequestService()

我想知道是否有人可以向我展示如何将上述内容转换为Redux。因此，我可以将值从<Picker />传递到API url，这意味着全局具有prop。

我尝试过多次使用Redux，但是失败了，所以我发现我必须使用Redux-thunk，但是我仍然不确定实现这一目标的最佳方法。

我发现了这个https://gist.github.com/umayr/4fe94741caa9339292e80e960aa19ff9 但是，如何将值传递给url？任何帮助表示感谢，谢谢。

例如

let url = 'api.example.com/result/${changedValue}' 
//The changedValue is the state chosen from <Picker />

在React本机应用中应用Redux

0 个答案: