React+Taro选择日期组件封装

话不多说,直接上效果

1.页面渲染时间模块

bash 复制代码
{this.renderCalendarPopup()}

2.引入时间组件弹层,state中加入showPopup(控制什么时候展示时间选择弹层),time(选择后的时间值)

bash 复制代码
private renderCalendarPopup = () => {
    const { showPopup, time } = this.state;
    return (
        <CalendarModal
            onConfirm={this.onCalendarPopupConfirm}
            selectedDate={time}
            visible={showPopup}
            onClose={this.closePopup}
        />
    );
};

3.分别引入时间弹层的CalendarModal控制组件,以及里面具体时间组件,请下载该链接里的两个包,放到项目中
具体代码在这个链接包里

相关推荐
BigTopOne33 分钟前
KOOM 学习计划
前端
自进化Agent智能体1 小时前
Hermes 技能系统详解——安装、使用与浏览
前端
JieE2121 小时前
前端不等人:用 Mock 接口工程让 React 应用独立起飞
前端·react.js·面试
东方小月1 小时前
从零开发一个 Coding Agent(九):实现 Agent 的工具调用闭环
人工智能·前端框架·node.js
用户355856959021 小时前
HTTPS到底会不会拖慢网站速度?TLS握手原理与性能优化实战
前端
王林不想说话1 小时前
React + Ant Design 后台项目:63 个业务组件的分层实践
react.js·typescript·ant design
xywww1681 小时前
真实后台页实测:Opus 5 看图写前端的可用边界在哪
linux·服务器·前端·数据库·人工智能·gpt
小小尚@2 小时前
AE脚本-AE Actions v1.1.8 操作动作记录器
开发语言·前端·javascript·jupyter·postman
大家的林语冰2 小时前
👍 超越 ESLint,Oxc 优先采用 TypeScript 7,Rust 和 Go 梦幻联动!
前端·javascript·typescript
不好听6133 小时前
React 记忆化三兄弟:memo、useMemo、useCallback 到底在缓存什么
react.js