优化空状态图片样式
This commit is contained in:
@@ -11,25 +11,39 @@ interface IProps {
|
||||
wrapperHeight?: string;
|
||||
width?: string;
|
||||
height?: string;
|
||||
scale?: string;
|
||||
}
|
||||
|
||||
const ListLoadError = (props: IProps) => {
|
||||
const { reload, text, errorImg, btnText, btnImg, wrapperHeight="", width = "", height = "" } = props;
|
||||
const {
|
||||
reload,
|
||||
text,
|
||||
errorImg,
|
||||
btnText,
|
||||
btnImg,
|
||||
wrapperHeight = "",
|
||||
width = "",
|
||||
height = "",
|
||||
scale = "",
|
||||
} = props;
|
||||
const handleReload = () => {
|
||||
reload && typeof reload === "function" && reload();
|
||||
};
|
||||
|
||||
return (
|
||||
<View className={styles.listLoadError} style={{height: wrapperHeight}}>
|
||||
<View className={styles.listLoadError} style={{ height: wrapperHeight }}>
|
||||
<Image
|
||||
className={styles.listLoadErrorImg}
|
||||
style={{ width, height }}
|
||||
style={{ width, height, transform: `scale(${scale})` }}
|
||||
src={errorImg ? img[errorImg] : img.ICON_LIST_LOAD_ERROR}
|
||||
/>
|
||||
{text && <Text className={styles.listLoadErrorText}>{text}</Text>}
|
||||
{reload && (
|
||||
<View className={styles.listLoadErrorBtn} onClick={handleReload}>
|
||||
<Image src={btnImg ? img[btnImg] : img?.ICON_LIST_RELOAD} className={styles.reloadIcon} />
|
||||
<Image
|
||||
src={btnImg ? img[btnImg] : img?.ICON_LIST_RELOAD}
|
||||
className={styles.reloadIcon}
|
||||
/>
|
||||
{btnText ? " " + btnText : "重试"}
|
||||
</View>
|
||||
)}
|
||||
|
||||
@@ -32,6 +32,7 @@ const ListContainer = (props) => {
|
||||
listLoadErrorWrapperHeight,
|
||||
listLoadErrorWidth,
|
||||
listLoadErrorHeight,
|
||||
listLoadErrorScale,
|
||||
} = props;
|
||||
const timerRef = useRef<NodeJS.Timeout | null>(null);
|
||||
const loadingStartTimeRef = useRef<number | null>(null);
|
||||
@@ -168,6 +169,7 @@ const ListContainer = (props) => {
|
||||
wrapperHeight={listLoadErrorWrapperHeight || ""}
|
||||
width={listLoadErrorWidth || ""}
|
||||
height={listLoadErrorHeight || ""}
|
||||
scale={listLoadErrorScale || ""}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -241,6 +241,7 @@ const MyselfPageContent: React.FC = () => {
|
||||
listLoadErrorWrapperHeight="fit-content"
|
||||
listLoadErrorWidth="320px"
|
||||
listLoadErrorHeight="152px"
|
||||
listLoadErrorScale="1.2"
|
||||
defaultShowNum={3}
|
||||
/>
|
||||
</ScrollView>
|
||||
@@ -262,6 +263,7 @@ const MyselfPageContent: React.FC = () => {
|
||||
listLoadErrorWrapperHeight="fit-content"
|
||||
listLoadErrorWidth="320px"
|
||||
listLoadErrorHeight="152px"
|
||||
listLoadErrorScale="1.2"
|
||||
defaultShowNum={3}
|
||||
/>
|
||||
</ScrollView>
|
||||
|
||||
@@ -316,6 +316,7 @@ const OtherUserPage: React.FC = () => {
|
||||
listLoadErrorWrapperHeight="fit-content"
|
||||
listLoadErrorWidth="320px"
|
||||
listLoadErrorHeight="152px"
|
||||
listLoadErrorScale="1.2"
|
||||
defaultShowNum={3}
|
||||
/>
|
||||
</ScrollView>
|
||||
@@ -359,6 +360,7 @@ const OtherUserPage: React.FC = () => {
|
||||
listLoadErrorWrapperHeight="fit-content"
|
||||
listLoadErrorWidth="320px"
|
||||
listLoadErrorHeight="152px"
|
||||
listLoadErrorScale="1.2"
|
||||
defaultShowNum={3}
|
||||
/>
|
||||
</ScrollView>
|
||||
|
||||
Reference in New Issue
Block a user