【发布时间】:2021-08-24 02:08:15
【问题描述】:
我有一个离子反应应用程序,它从一个休息 API 中获取数据。当我将 ab 与 ionic 服务器或 Android 捆绑在一起时,该应用程序运行良好。 当我在 iOS 上运行相同的代码时,我得到了一个空白页。之前的一些版本也可以在 iOS 上运行。当我将代码重新设置为 5 天前的版本时,它现在根本不起作用。
代码如下所示:
export default function PostsContainer() {
let {categoryid} = useParams<any>();
const [posts, setPosts] = useState<any[]>([]);
const [page, setPage] = useState<number>(1);
const [totPages, setTotPages] = useState<number>(1);
const [title, setTitle] = useState<string>("Recent posts");
const baseUrl = BASE_URL + "wp-json/wp/v2";
const [loadingPosts, setLoadingPosts] = useState<boolean>(false);
useEffect(() => {
async function loadPosts() {
setLoadingPosts(false)
let url = baseUrl + "/posts?status=publish&page=" + page;
if (categoryid !== undefined) {
url = url + "&categories=" + categoryid;
getCategoryName(categoryid);
}
const response = await fetch(url);
if (!response.ok) {
return;
}
const totalPages = await response.headers.get("x-wp-totalpages");
const postsTemp = await response.json();
setPosts(postsTemp);
setTotPages(Number(totalPages));
setLoadingPosts(true);
console.log(posts)
}
loadPosts();
}, [page, categoryid]);
function handleClickNextPage() {
setPage(page + 1);
}
async function getCategoryName(id: number) {
let url = baseUrl + "/categories/" + id;
const response = await fetch(url);
if (!response.ok) {
return;
}
const category = await response.json();
setTitle(category.name);
}
if (loadingPosts) {
return (
<IonPage>
<IonHeader translucent={true}>
</IonHeader>
<IonContent>
{page === 1 ? <Slider listOfPosts={posts}/> : <div/>}
<Posts
listOfPosts={posts}
totPages={totPages}
handleClickNextPage={handleClickNextPage}
pageNumber={page}
/>
</IonContent>
</IonPage>
);
} else {
return <IonLoading
isOpen={!loadingPosts}
message={ION_LOADING_DIALOG}
duration={ION_LOADING_DURATION}
/>
}
}
是否有属于其余 api 的任何设置?调用的是带有 https 的 URL。当我删除 useefect 并仅呈现没有内容的静态页面时,它可以正常工作。
【问题讨论】:
标签: ios reactjs rest ionic-framework