Ant Design Vue はグローバル空データを設定し、グローバル空ラベルのデフォルトの「データなし」を「データなし」に変更します。

方法 1: グローバル言語を中国語に設定すると、次のような効果が得られます。

      

 

方法 2: App.vue で空のタグを書き換えます。効果は次のとおりです (ここではテキストのみが変更され、他のスタイルも変更できます)

 

ステップ:

1. グローバル設定の main.js に ConfigProvider を導入します

import ConfigProvider from "ant-design-vue";
Vue.use(ConfigProvider);

2. App.vue で ConfigProvider を変更します

<template>
  <a-config-provider :locale="locale">
  此处的template为重写全局空状态,删去这段template即为方法1效果
        <template #renderEmpty>									
          <a-empty description="暂无数据"></a-empty>
        </template>
    <div id="app">
      <router-view />
    </div>
  </a-config-provider>
</template>
    
<script>
将全局的语言改成中文
import zhCN from "ant-design-vue/lib/locale-provider/zh_CN";
export default {
  data() {
    return {
      locale: zhCN
    };
  }
};
</script>

 要約:

ConfigProvider はグローバル設定のコンポーネントであり、Vue のProvide/Inject機能を使用すると、アプリケーションに 1 回ラップするだけでグローバルに有効になります。

公式APIは以下の通りです。

スロットを使用して空の状態属性を書き換えたり、ロケール属性を中国語に直接設定したりすることで効果を実現でき、ニーズに応じて選択できます。

 

 

 

 

おすすめ

転載: blog.csdn.net/m0_46550764/article/details/121353676