ant-design-vue中a-date-picker汉化失败问题

最新推荐文章于 2024-03-27 15:22:19 发布

weixin_45789779

最新推荐文章于 2024-03-27 15:22:19 发布

阅读量538

点赞数 8

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_45789779/article/details/136742500

版权

ant-design-vue中a-date-picker汉化失败问题
Vue版本：vue2
ant-design-vue版本： 1.3.8
今天接触了一版非常古老的后管系统，遇到了a-date-picker汉化失败。起初小编也是直接用了官网（官网地址）的方式（相信大家在看到内容也是这样）。

<template>
  <a-date-picker :locale="locale" />
</template>
<script>
  import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
  export default {
    data() {
      return {
        locale,
      };
    },
  };
</script>

然而当小编用了该方式处理时，神奇的事情发生了！这种方式在页面中时而有用，时而无用。而且如果你将该picker单独拎成组件再引入页面又恒久有用。但是，对于单一组件拎做组件显然是浪费资源且不合理的行为，于是小编又挖呀挖呀挖，找到了如下方式解决以上问题。如果你和小编一样只需要对单一组件进行汉化处理，可以尝试一下以下方法。

// 针对webpack打包
<template>
  <a-date-picker :locale="locale" />
</template>
<script>
  import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
  import moment from 'moment'
  import 'moment/locale/zh-cn'
  export default {
    data() {
      return {
        locale,
      };
    },
  };
</script>

// 针对vite打包
<template>
  <a-date-picker :locale="locale" />
</template>
<script>
  import locale from 'ant-design-vue/es/date-picker/locale/zh_CN';
  import moment from 'moment'
  import 'moment/locale/dist/zh-cn'
  export default {
    data() {
      return {
        locale,
      };
    },
  };
</script>

希望对你有用~