引入组件

局部引入

// parent.vue
const FLoading = defineAsyncComponent(() => import('@/components/formaui/f-loading/f-loading.vue'))

基础用法

<f-loading></f-loading>
<f-loading :icon-type="1"></f-loading>
<f-loading :icon-type="2"></f-loading>
<f-loading :icon-type="3"></f-loading>
<f-loading :icon-type="4"></f-loading>
<f-loading :icon-type="5"></f-loading>
<f-loading :icon-type="6"></f-loading>
<f-loading :icon-type="7"></f-loading>
<f-loading margin="20rpx 0" padding="30rpx" text="自定义文字"></f-loading>
<f-loading type="column" is-fixed></f-loading>

插槽

名称	说明
-	-

属性

名称	类型	说明	默认值
type	string	样式类型，可传入[row、column]	row
iconType	number	图标类型，可传入[0、1、2、3、4、5、6、7]	0
icon	string	自定义图标iconType=0时生效	-
text	string	自定义文字	加载中
textColor	string	自定义文字颜色	type=row:#888888/type=column:#FFFFFF
fontSize	string	自定义文字大小	26rpx
bgColor	string	自定义背景颜色	type=row:transparent/type=column:rgba(0, 0, 0, 0.6)
borderRadius	string	自定义圆角type=column时生效	16rpx
isFixed	boolean	是否固定在屏幕中心	false
isMask	boolean	是否显示遮罩层isFixed=true时生效	false
maskColor	string	自定义遮罩颜色	rgba(0, 0, 0, 0.3)
margin	string	自定义外边距type=row时生效	0
padding	string	自定义内边距type=row时生效	0

事件

事件名	说明	回调参数
-	-	-