javascript/element-plus
1
0
Fork 0
mirror of https://github.com/element-plus/element-plus.git synced 2026-03-13 07:51:17 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(components): [loading] namespace (#7857)

Browse Source
This commit is contained in:
qiang
2022-05-24 15:25:46 +08:00
committed by GitHub
parent 4ae21b0632
commit 0600f27af5
2 changed files with 15 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
packages/components/loading/src/loading.ts
View File

@@ -10,6 +10,7 @@ import {
withCtx,
withDirectives,
} from 'vue'
import { useNamespace } from '@element-plus/hooks'
import { removeClass } from '@element-plus/utils'
import type { LoadingOptionsResolved } from './types'
@@ -17,6 +18,7 @@ import type { LoadingOptionsResolved } from './types'
export function createLoadingComponent(options: LoadingOptionsResolved) {
let afterLeaveTimer: number
const ns = useNamespace('loading')
const afterLeaveFlag = ref(false)
const data = reactive({
...options,
@@ -36,12 +38,12 @@ export function createLoadingComponent(options: LoadingOptionsResolved) {
target.getAttribute('loading-number')
loadingNumber = Number.parseInt(loadingNumber as any) - 1
if (!loadingNumber) {
removeClass(target, 'el-loading-parent--relative')
removeClass(target, ns.bm('parent', 'relative'))
target.removeAttribute('loading-number')
} else {
target.setAttribute('loading-number', loadingNumber.toString())
}
removeClass(target, 'el-loading-parent--hidden')
removeClass(target, ns.bm('parent', 'hidden'))
}
remvoeElLoadingChild()
loadingInstance.unmount()
@@ -98,13 +100,13 @@ export function createLoadingComponent(options: LoadingOptionsResolved) {
)
const spinnerText = data.text
? h('p', { class: 'el-loading-text' }, [data.text])
? h('p', { class: ns.b('text') }, [data.text])
: undefined
return h(
Transition,
{
name: 'el-loading-fade',
name: ns.b('fade'),
onAfterLeave: handleAfterLeave,
},
{
@@ -117,7 +119,7 @@ export function createLoadingComponent(options: LoadingOptionsResolved) {
backgroundColor: data.background || '',
},
class: [
'el-loading-mask',
ns.b('mask'),
data.customClass,
data.fullscreen ? 'is-fullscreen' : '',
],
@@ -126,7 +128,7 @@ export function createLoadingComponent(options: LoadingOptionsResolved) {
h(
'div',
{
class: 'el-loading-spinner',
class: ns.b('spinner'),
},
[spinner, spinnerText]
),

12
packages/components/loading/src/service.ts
View File

@@ -2,7 +2,7 @@ import { nextTick } from 'vue'
import { isString } from '@vue/shared'
import { isClient } from '@vueuse/core'
import { addClass, getStyle, removeClass } from '@element-plus/utils'
import { useZIndex } from '@element-plus/hooks'
import { useNamespace, useZIndex } from '@element-plus/hooks'
import { createLoadingComponent } from './loading'
import type { LoadingInstance } from './loading'
import type { LoadingOptionsResolved } from '..'
@@ -134,17 +134,19 @@ const addClassList = (
parent: HTMLElement,
instance: LoadingInstance
) => {
const ns = useNamespace('loading')
if (
instance.originalPosition.value !== 'absolute' &&
instance.originalPosition.value !== 'fixed'
) {
addClass(parent, 'el-loading-parent--relative')
addClass(parent, ns.bm('parent', 'relative'))
} else {
removeClass(parent, 'el-loading-parent--relative')
removeClass(parent, ns.bm('parent', 'relative'))
}
if (options.fullscreen && options.lock) {
addClass(parent, 'el-loading-parent--hidden')
addClass(parent, ns.bm('parent', 'hidden'))
} else {
removeClass(parent, 'el-loading-parent--hidden')
removeClass(parent, ns.bm('parent', 'hidden'))
}
}