如何使用 Redux 在 React Native 中使用线程调用 API？
Posted
技术标签:
【中文标题】如何使用 Redux 在 React Native 中使用线程调用 API？【英文标题】：how to call API using thread in React native using redux? 【发布时间】：2020-05-07 05:15:48 【问题描述】：如何在 react native 中调用后台线程。使用后台线程创建应用程序来调用 API。建议我实现这一目标。
import React, Component from 'react'
import WebView from 'react-native'
export default class BackgroundTaskRunner extends Component
render()
return (
<WebView
ref=el => this.webView = el
source=html: '<html><body></body></html>'
onMessage=this.handleMessage
/>
)
runJSInBackground (code)
this.webView.injectjavascript(code)
handleMessage = (e) =>
const message = e.nativeEvent.data
console.log('message from webview:', message)
这是调用后台线程的方式还是有更好的方式来使用线程执行 API 调用？
【问题讨论】：
请分享您尝试过的代码 react-native 不支持多线程，所以我认为最好的方法是使用 redux 并调度一个动作 好的，我没有尝试过，所以请提供代码片段的想法会有所帮助 你应该先用你自己对这个问题的假设来尝试，先尝试你的假设来测试你的知识，如果你所有的努力都没有采取任何行动，然后发布寻求帮助。只有这样学习才能提高你。 顺便说一句，ReactNative 应用程序使用 JS 实现，因此 ReactNative 中没有多线程。您必须了解 JS 中的异步，利用 redux、redux-saga 来处理您的应用程序状态、调用 API 并存储到状态中。如果您想获得多处理的好处，请尝试使用 Swift (ios)、Java (android) 编写本机库，然后将其集成到您的应用程序中 【参考方案1】：React-native 不支持多线程。因此，要调用 api，您可以使用 redux 调度一个动作，该动作又通过 axios 调用 Api。因此，要么通过 redux 方法，要么您可以使用简单的 axios 库。
我建议你使用 axios，因为它会很整洁，你可以简单地这样做：
import axios from './axiosWrapper';
export const getItineryRequest = async tripId =>
const params =
packageId: '26169',
packageId: tripId,
ip: 'true',
;
return await axios.get('app/user-package-details/', params);
;
axios.get 是一个获取请求。希望能帮助到你。如有疑问，请随意
【讨论】：
谢谢。你能举一个使用redux而不是使用任何第三方库来完成这个任务的例子吗 axios 是最常用的库之一，也是值得信赖的，如果你想使用 redux ，还需要 3rd 方和 .到底axios【参考方案2】：react-native-threads 是目前最接近多线程的。见why Javascript doesn't support multithreading。
您要实现的目标实际上很常见，并且由公共库实现，Javascript 并发执行代码而不是并行执行代码，除非您正在执行 CPU 繁重的工作，否则不会有区别。
这是一个可以在 React Native 中开箱即用的 sn-p。注意fetch 这里是一个全局变量。 React Native docs 是一个很好的起点。
function getMoviesFromApiAsync()
return fetch('https://facebook.github.io/react-native/movies.json')
.then((response) => response.json())
.then((responseJson) =>
return responseJson.movies;
)
.catch((error) =>
console.error(error);
);
【讨论】：
这只是 API 调用，并没有在后台使用任何线程。以上是关于如何使用 Redux 在 React Native 中使用线程调用 API？的主要内容，如果未能解决你的问题，请参考以下文章
如何在 App.js (React-Native) 中访问 redux 状态
如何使用 redux 模式在 react native 中刷新组件？
如何在reducer中专门使用redux来获取react-native中的API？