【VUE】element-plus loading组件 text无法更新问题

在Element Plus中，如果你遇到了<el-loading>组件的text属性无法更新的问题，可能是因为你没有正确使用Vue的响应式数据绑定。

确保你的text属性是响应式的，即它是Vue实例的data属性，或者是计算属性(computed)，这样当它的值改变时，Vue会自动更新DOM。

以下是一个简单的例子，展示如何使用<el-loading>组件的text属性：

<template>
  <el-loading :text="loadingText" :visible="isLoading"></el-loading>
</template>
 
<script>
import { ref } from 'vue';
 
export default {
  setup() {
    const isLoading = ref(true);
    const loadingText = ref('加载中...');
 
    // 模拟加载完成后更新loading文本
    setTimeout(() => {
      isLoading.value = false;
      loadingText.value = '加载完成！';
    }, 3000);
 
    return { isLoading, loadingText };
  }
};
</script>

在这个例子中，isLoading和loadingText都是响应式的，因此当isLoading变为false并且loadingText更新时，<el-loading>组件会相应地隐藏并显示新的文本。

如果你已经正确地使用了响应式数据绑定，但问题依然存在，请检查是否有其他的Vue实例或组件的状态管理导致了这个问题。确保没有其他的状态更新问题或者是Vue的渲染问题。