首页 > 其他分享 >vue3+jsx+antd项目,ant design vue组件中日期组件的自定义格式

vue3+jsx+antd项目,ant design vue组件中日期组件的自定义格式

时间:2023-02-16 10:34:43浏览次数:43  
标签:style vue 自定义 current moment 组件 antd

目标效果

实际效果

关键代码,直接从react版本的antd复制的代码,并修改了,current加上了moment(current)

<DatePicker
      dateRender={current => {
        const style = {};
        if (moment(current).date() === 1) {
          style.border = '1px solid #1890ff';
          style.borderRadius = '50%';
        }
        return (
          <div className="ant-calendar-date" style={style}>
            {moment(current).date()}
          </div>
        );
      }}
    />

分析原因

current 这个参数一直时重复的

标签:style,vue,自定义,current,moment,组件,antd
From: https://www.cnblogs.com/cn-oldboy/p/17125837.html

相关文章

  • Vue 路由跳转设置不刷新
    一、问题描述在某些情况下,vue项目前端有些情况下需要设置路由跳转,页面不刷新,比如:前进导航刷新页面,后退不刷新,page1-->page2-->page3,每次前进到一个新页面都需要获取数......
  • Vite创建Vue3项目识别 ../ 与 @/ 引入路径失效解决方案
    Vite创建Vue3项目识别../与@/引入路径 在使用vite脚手架生成项目时,会出现一些引入路径失败的错误例子:router中用component引入路径时引入../路径失败找不......
  • element + vue 实现背景图片设置
    <template><div><el-row><el-col:span="3"><el-uploadaction="#"list-type="picture-card":file-list="file......
  • 一次学俩Vue&Blazor:1.4基础-响应式数据
    一、声明式编程和响应式数据1、声明式编程逻辑层修改视图层元素属性值的方式有两种,一是命令式,先通过getElementById等方法获取元素对象,然后再修改对象的属性;二是声明式......
  • Vue 自定义指令
      案例1:定义一个v-big指令,和v-text功能类似,但会把绑定的数值放大10倍<!DOCTYPEhtml><head><metacharset="UTF-8"/><scripttype="text/javascript"sr......
  • Vue
    目录一.Vue介绍1.前端发展史2.Vue简介渐进式框架网站3.Vue特点易用灵活高效4.M-V-VM思想①MVVM介绍②MVVM的特性5.组件化开发、单页面开发组件化开发单页面开发(spa)6.版......
  • Vue v-once指令 和 v-pre指令
    v-once指令:1、v-once所在节点在初始化动态渲染后,就视为静态内容了2、以后数据的改变不会引起v-once所在结构的更新,可用于优化性能v-pre指令:1、跳过其所在节点的编译过......
  • vue基础:js的几种循环方式、key值的解释、数组,对象的检测与更新、input事件、v-model双
    目录一、js的几种循环方式1.1v-for可以循环的变量1.2js的循环方式二、key值的解释三、数组,对象的检测与更新四、input事件五、v-model双向数据绑定六、过滤案例七、事件......
  • vue-3
    js的几种循环方式v-for可以循环的变量可以循环的有数组,对象,字符串,数字<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</titl......
  • vue_day03
    今日内容1js的几种循环方式1.1v-for可以循环的变量<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><title>Title</title><scriptsrc......