110 lines
3.0 KiB
JavaScript
110 lines
3.0 KiB
JavaScript
import {
|
|
View,
|
|
RefreshControl,
|
|
ActivityIndicator,
|
|
FlatList,
|
|
} from "react-native";
|
|
import React, { useState, useEffect } from "react";
|
|
import Empty from "../../../components/Empty";
|
|
import { useTailwind } from "tailwind-rn";
|
|
import baseRequest from "../../../utils/baseRequest";
|
|
import Toast from "react-native-toast-message";
|
|
import { generateSignature } from "../../../utils/crypto";
|
|
import Post from "../../../components/Post";
|
|
|
|
export default function FeedPosts() {
|
|
//获取新数据
|
|
const [data, setData] = useState([]);
|
|
const [isActivityIndicatorShow, setIsActivityIndicatorShow] = useState(true);
|
|
const [isFetching, setIsFetching] = useState(false);
|
|
const getData = async (type = 0) => {
|
|
//type 0-上滑 1-下拉 2-初始化
|
|
if (isFetching) return;
|
|
const apiUrl = process.env.EXPO_PUBLIC_API_URL;
|
|
setIsFetching(true);
|
|
try {
|
|
const base = await baseRequest();
|
|
const signature = await generateSignature({
|
|
op_type: type,
|
|
...base,
|
|
});
|
|
const _response = await fetch(
|
|
`${apiUrl}/api/moment/recomm_list?signature=${signature}`,
|
|
{
|
|
method: "POST",
|
|
headers: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
body: JSON.stringify({
|
|
op_type: type,
|
|
...base,
|
|
}),
|
|
}
|
|
);
|
|
const _data = await _response.json();
|
|
if (_data.ret === -1) {
|
|
Toast.show({
|
|
type: "error",
|
|
text1: _data.msg,
|
|
topOffset: 60,
|
|
});
|
|
return;
|
|
}
|
|
if (type === 1 || type === 2) {
|
|
setData((prev) => _data.data.recomm_list);
|
|
setIsActivityIndicatorShow(true);
|
|
} else {
|
|
setData((prev) => [...prev, ..._data.data.recomm_list]);
|
|
if (_data.data.recomm_list.length === 0)
|
|
setIsActivityIndicatorShow(false);
|
|
}
|
|
} catch (error) {
|
|
console.error(error);
|
|
} finally {
|
|
setIsFetching(false);
|
|
}
|
|
};
|
|
|
|
//初始化加载
|
|
useEffect(() => {
|
|
getData(2);
|
|
}, []);
|
|
|
|
const tailwind = useTailwind();
|
|
const renderItem = ({ item }) => <Post data={item} />;
|
|
const [refreshing, setRefreshing] = useState(false);
|
|
//下拉刷新
|
|
const handleRefresh = async () => {
|
|
setRefreshing(true);
|
|
await getData(1);
|
|
setRefreshing(false);
|
|
};
|
|
|
|
return (
|
|
<View style={tailwind("flex-1")}>
|
|
<FlatList
|
|
data={data}
|
|
renderItem={renderItem}
|
|
initialNumToRender={4}
|
|
refreshControl={
|
|
<RefreshControl
|
|
colors={["#FF669E"]}
|
|
tintColor="white"
|
|
refreshing={refreshing}
|
|
onRefresh={() => handleRefresh()}
|
|
/>
|
|
}
|
|
onEndReached={() => getData(0)}
|
|
ListEmptyComponent={<Empty type="nodata" />}
|
|
ListFooterComponent={
|
|
<View>
|
|
{isActivityIndicatorShow && data.length !== 0 && (
|
|
<ActivityIndicator style={tailwind("my-4")} size="large" />
|
|
)}
|
|
</View>
|
|
}
|
|
/>
|
|
</View>
|
|
);
|
|
}
|