fix(loading): fix loading error show when parent's display is not block (#1250)

* fix(loading): fix loading error show when parent's display is not block

* test(loading): add loading test case

packages/loading/__tests__/loading.spec.ts

@@ -1,5 +1,6 @@
 import { mount } from '@vue/test-utils'
 import Loading from '../src/index'
+import ElInput from '../../input'
 import vLoading from '../src/directive'
 import { nextTick } from 'vue'
 import { sleep } from '@element-plus/test-utils'
@@ -253,4 +254,22 @@ describe('Loading', () => {
     expect(customClass).toBeTruthy()
   })
 
+  test('parent\'s display is not block', async () => {
+    const wrapper = mount({
+      directives: {
+        loading: vLoading,
+      },
+      components: {
+        ElInput,
+      },
+      template: `<el-input v-loading="true">
+      <template #append>
+        <i class="el-icon-question"></i>
+      </template>
+      </el-input>`,
+    })
+    const maskDisplay = getComputedStyle(wrapper.find('.el-loading-mask').element).display
+    expect(maskDisplay).toBe('block')
+  })
+
 })

packages/loading/src/createLoadingComponent.ts

@@ -84,7 +84,7 @@ export function createLoadingComponent({ options , globalLoadingOption }: ILoadi
         default: () => h('div', {
           style: {
             backgroundColor: this.background || '',
-            display: this.visible ? 'inherit' : 'none',
+            display: this.visible ? null : 'none',
           },
           class: [
             'el-loading-mask',