antd DatePicker月份不显示中文

news2024/11/25 0:54:10
import 'dayjs/locale/zh-cn';
import locale from 'antd/es/date-picker/locale/zh_CN';

<DatePicker
   onChange={changeMonth}
   picker="month"
   disabledDate={disabledDate}
   locale={locale}
/>

看着代码没问题执行如下图

查了下原因默认的中文local文件并没有月份的format格式,直接上代码解决:

let definedChineseLocal: PickerLocale = {
    lang: {
      locale: 'zh_CN',
      placeholder: '请选择日期',
      rangePlaceholder: ['Start date', 'End date'],
      today: 'Today',
      now: 'Now',
      backToToday: 'Back to today',
      ok: 'Ok',
      clear: 'Clear',
      month: 'Month',
      year: 'Year',
      timeSelect: 'Select time',
      dateSelect: 'Select date',
      monthSelect: 'Choose a month',
      yearSelect: 'Choose a year',
      decadeSelect: 'Choose a decade',
      yearFormat: 'YYYY年',
      dateFormat: 'M/D/YYYY',
      dayFormat: 'D',
      dateTimeFormat: 'M/D/YYYY HH:mm:ss',
      monthFormat: 'M月',
      monthBeforeYear: true,
      previousMonth: 'Previous month (PageUp)',
      nextMonth: 'Next month (PageDown)',
      previousYear: 'Last year (Control + left)',
      nextYear: 'Next year (Control + right)',
      previousDecade: 'Last decade',
      nextDecade: 'Next decade',
      previousCentury: 'Last century',
      nextCentury: 'Next century',
    },
    timePickerLocale: {
      placeholder: 'Select time',
    },
    dateFormat: 'YYYY-MM-DD',
    dateTimeFormat: 'YYYY-MM-DD HH:mm:ss',
    weekFormat: 'YYYY-wo',
    monthFormat: 'YYYY-MM',
  };

<DatePicker
                onChange={changeMonth}
                picker="month"
                disabledDate={disabledDate}
                locale={definedChineseLocal}
              />

修改后效果

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/949721.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

无涯教程-Android - ImageButton函数

ImageButton是一个AbsoluteLayout,可让您指定其子级的确切位置。这显示了带有图像(而不是文本)的按钮,用户可以按下或单击该按钮。 Android button style set ImageButton属性 以下是与ImageButton控件相关的重要属性。您可以查看Android官方文档以获取属性的完整列表以及可以…

ONLYOFFICE HackerOne 错误赏金计划:2023 年夏季快报

我们的 HackerOne 计划自 2022 年启动&#xff0c;范围持续扩大&#xff0c;节奏不断加快。欢迎您查看今年的数据&#xff0c;了解范围内的新项目——ONLYOFFICE 协作空间&#xff0c;了解如何通过 HackerOne&#xff0c;开启 ONLYOFFICE 解决方案测试之旅。 关于 ONLYOFFICE 赏…

华为OD机试 - 数字序列比大小 - 贪心算法(Java 2023 B卷 100分)

目录 一、题目描述二、输入描述三、输出描述四、解题思路五、Java算法源码六、效果展示1、输入2、输出3、说明 华为OD机试 2023B卷题库疯狂收录中&#xff0c;刷题点这里 一、题目描述 A&#xff0c;B两个人万一个数字比大小的游戏&#xff0c;在游戏前&#xff0c;两个人会拿…

【c语言】输出n行按如下规律排列的数

题述&#xff1a;输出n行按如下规律排列的数 输入&#xff1a; 4(应该指的是n) 输出: 思路&#xff1a; 利用下标的规律求解&#xff0c;考察数组下标的灵活应用&#xff0c;我们可以看出数从1开始是斜着往下放的&#xff0c;那么我们如何利用两层for循环求解这道题&#xff…

Oracle基础用法

操作环境&#xff1a;操作系统为Windows10-64位 操作版本&#xff1a; Oracle Database 11g Enterprise Edition Release 11.2.0.1.0 - 64bit Production PL/SQL Developer Version 12.0.7.1837 (64bit) 01.226959 目录 $函数一、nvl与coalesce1、nvl(eExpression1, eExpressio…

Android AGP版本

做个记录&#xff1a; Android AGP版本 https://developer.android.com/studio/releases/gradle-plugin?hlzh-cn

【前端】CSS3新特性

目录 一、前言二、伪元素选择器1、选择器2、注意事项3、代码示例 三、伪元素清除浮动1、第一种伪元素清除浮动2、第二种伪元素清除浮动 四、CSS3盒子模型1、box-sizing&#xff1a;content-box2、box-sizing&#xff1a;border-box 五、CSS3图片模糊处理1、图片变模糊①、CSS3滤…

Hive-安装与配置(1)

&#x1f947;&#x1f947;【大数据学习记录篇】-持续更新中~&#x1f947;&#x1f947; 个人主页&#xff1a;beixi 本文章收录于专栏&#xff08;点击传送&#xff09;&#xff1a;【大数据学习】 &#x1f493;&#x1f493;持续更新中&#xff0c;感谢各位前辈朋友们支持…

小白到运维工程师自学之路 第八十集 (Jumpserver堡垒机管理)2

5、登录普通用户进行测试 这里的操作和在linux系统中的终端操作一样 在Xshell中登录 创建一个普通文件 在web终端中查看 五、审计台 在审计台中可以看到服务器的各种详细操作 在这里可以看到哪个用户在哪个时间对服务器具体使用了什么命令&#xff0c;还可以看到录频回放。 …

提升开发能力的低代码思路

一、低代码理念 在现代软件开发中&#xff0c;低代码开发平台备受关注。那么&#xff0c;什么是低代码开发平台呢&#xff1f;简单来说&#xff0c;它是一种能够提供丰富的图形化用户界面&#xff0c;让开发者通过拖拽组件和模型就能构建应用的开发环境。与传统开发方式相比&am…

对负载均衡的全面理解

title: 对负载均衡的全面理解 date: 2021-07-10 21:41:24 tags: TCP/IP 对负载均衡服务(LBS)大名入行不多久就一直听闻&#xff0c;后来的工作中&#xff0c;也了解到 软件负载均衡器&#xff0c;如被合入Linux内核的章文嵩的LVS&#xff0c;还有以应用程序形式出现的HAProxy、…

设计模式--装饰者模式(Decorator Pattern)

一、什么是装饰者模式&#xff08;Decorator Pattern&#xff09; 装饰者模式&#xff08;Decorator Pattern&#xff09;是一种结构型设计模式&#xff0c;它允许你在不修改现有对象的情况下&#xff0c;动态地将新功能附加到对象上。这种模式通过创建一个包装类&#xff0c;…

hosts文件位置在哪里,教你hosts文件位置在哪里

Hosts是一个没有扩展名的系统文件&#xff0c;其基本作用就是将一些常用的网址域名与其对应的IP地址建立一个关联"数据库",当用户在浏览器中输入一个需要登录的网址时&#xff0c;系统会首先自动从Hosts文件中寻找对应的IP地址&#xff0c;一旦找到&#xff0c;系统会…

(动态规划) 剑指 Offer 66. 构建乘积数组——【Leetcode每日一题】

❓ 剑指 Offer 66. 构建乘积数组 难度&#xff1a;中等 给定一个数组 A[0,1,…,n-1]&#xff0c;请构建一个数组 B[0,1,…,n-1]&#xff0c;其中 B[i] 的值是数组 A 中除了下标 i 以外的元素的积, 即 B[i]A[0]A[1]…A[i-1]A[i1]…A[n-1]。不能使用除法。 示例: 输入: [1,2,3…

【数学建模】-- 模糊综合评价

模糊综合评价&#xff08;Fuzzy Comprehensive Evaluation&#xff09;是一种用于处理不确定性和模糊性信息的决策分析方法。它通常用于解决复杂的多指标决策问题&#xff0c;其中各指标之间可能存在交叉影响和模糊性的情况。模糊综合评价通过将不确定性和模糊性量化&#xff0…

程序员的福音,高效取【淘宝 1688 京东】商品详情页面数据,API 接口封装系列

业务场景&#xff1a;作为全球最大的 B2C 电子商务平台之一&#xff0c;淘宝天猫平台提供了丰富的商品资源&#xff0c;吸引了大量的全球买家和卖家。为了方便开发者接入淘宝天猫平台&#xff0c;淘宝天猫平台提供了丰富的 API 接口&#xff0c;其中历史价格接口是非常重要的一…

ATA-2081高压放大器的电子实验案例(案例合集)

ATA-2081是一款理想的可放大交直流信号的单通道高压放大器。最大输出800Vp-p(400Vp)高压&#xff0c;可以驱动高压型负载。凭借其优异的指标参数受到不少电子工程师的喜欢&#xff0c;其在电子实验中的应用也非常频繁&#xff0c;下面为大家整理出ATA-2081高压放大器的应用案例…

Java实现根据商品ID获取当当商品详情数据,当当商品详情数据接口,当当网API接口封装方法

要通过当当网的API获取商品详情数据&#xff0c;您可以使用当当开放平台提供的接口来实现。以下是一种使用Java编程语言实现的示例&#xff0c;展示如何通过当当开放平台API获取商品详情属性数据接口&#xff1a; 首先&#xff0c;确保您已注册成为当当网开放平台的开发者&…

css中文本阴影特效

文字颜色渐变 .text-clip{color:transparent;font-size: 40px;font-weight: bold;background: linear-gradient(45deg, rgba(0,173,181,1) 0%, rgba(0,173,181,.4) 100%);-webkit-background-clip: text; } 文字模糊 .text-blurry{text-align: center;color: transparent;text-…

Qt 6.5.2连接MySQL及测试代码(附驱动文件)

版本&#xff1a;Windows_64位&#xff0c;Qt 6.5.2&#xff0c;MySQL 8.0 一、配置驱动文件&#xff08;3步搞定&#xff01;&#xff09; 现在Qt6版本不提供MySQL的驱动&#xff0c;而且也没有pro项目让你生成驱动的dll文件&#xff0c;所以只要你使用Qt6版本就需要手动去生…