diff --git a/src/components/Loading/src/Loading.vue b/src/components/Loading/src/Loading.vue
index 3803085ae..d5e9383ef 100644
--- a/src/components/Loading/src/Loading.vue
+++ b/src/components/Loading/src/Loading.vue
@@ -1,7 +1,7 @@
 <template>
   <section
     class="full-loading"
-    :class="{ absolute, [theme]: !!theme }"
+    :class="{ absolute, [`${theme}`]: !!theme }"
     :style="[background ? `background-color: ${background}` : '']"
     v-show="loading"
   >
diff --git a/src/views/demo/comp/loading/index.vue b/src/views/demo/comp/loading/index.vue
index 351277fd0..cdf19a8fc 100644
--- a/src/views/demo/comp/loading/index.vue
+++ b/src/views/demo/comp/loading/index.vue
@@ -40,7 +40,13 @@
       const wrapEl = ref<ElRef>(null);
 
       const loadingRef = ref(false);
-      const compState = reactive({
+      const compState = reactive<{
+        absolute?: boolean;
+        loading?: boolean;
+        theme?: 'dark' | 'light';
+        background?: string;
+        tip?: string;
+      }>({
         absolute: false,
         loading: false,
         theme: 'dark',