指南
UI
表单
指南
UI
表单

加载组件

引入

import { FairysTaroLoading , FairysTaroLoadingMain } from '@fairys/taro-tools-react';

组件参数

import type { ViewProps } from '@tarojs/components';

export interface FairysTaroLoadingProps extends ViewProps {
  /**加载标题*/
  title?: ReactNode;
  /**加载提示*/
  tips?: ReactNode;
  /**是否显示加载动画*/
  loading?: boolean;
  /**是否显示在 Portal 中*/
  isPortal?: boolean;
}

使用1

TIP

直接在页面上显示加载动画，无loading和isPortal参数

import { FairysTaroLoadingMain } from '@fairys/taro-tools-react';
import { View, Text , Button } from '@tarojs/components';

const Page = ()=>{

  return (
    <View style={{ position:'relative' }}>
      <FairysTaroLoadingMain  />
      <Text>Hello World</Text>
    </View>
  )
}

export default Page

使用2

TIP

默认使用 isPortal 为 true，将加载动画显示在 Portal 中

/***/
import { FairysTaroLoading } from '@fairys/taro-tools-react';
import { View, Text , Button } from '@tarojs/components';

const Page = ()=>{

  return (
    <View>
      <FairysTaroLoading loading={true} />
      <Text>Hello World</Text>
    </View>
  )
}
export default Page
ON THIS PAGE