react的前端ui的ant-mobile的picker不能滚动

最新推荐文章于 2024-09-11 08:03:35 发布
最新推荐文章于 2024-09-11 08:03:35 发布
阅读量692 收藏
点赞数
文章标签： react native
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/northSand/article/details/112555971
版权

ant-mobile的picker不能滚动
本人最近该开始使用react开发单页面应用，使用心得就不说了，用的还可以就是很多未知的坑需要自己踩踩
其中用了一个ant-mobile的picker，因为用在了粘性布局的那个react-sticky里面导致了这个picker显示后鼠标不能滚动，样式不生效
后面可以通过visible属性放到外边，就可以正常使用了

northSand
关注
React实现滑动选择插件（仿Antd-mobile Picker）
weixin_33924770的博客
05-31 2558
效果图 需求 由于移动端iOS和安卓原生select样式和效果不同，同一个控件在不同系统上效果不同。所以决定制作一个跟iOS风格类似的，可以滚动，选择器插件。之后看到了antd-mobile里面的picker插件符合我们的要求，使用了一段时间感觉其效果不错，隧查看源码，探究其制作过程。但是antd-mobile是Typescript编写...
antd-mobile按需加载
青阳的博客
09-15 831
1方式一为手动引入实现按需加载 import DatePicker from 'antd-mobile/lib/date-picker'; // 加载 JS import 'antd-mobile/lib/date-picker/style/css'; // 加载 CSS // import 'antd-mobile/lib/date-picker/style'; // 加载 LESS 2方式二为自动引入实现按需加载 antd-mobile通过暴露配置 配合 babe
ant mobile design组件库的PickerView组件不能滑动
wangweiscsdn的博客
09-06 340
本地开发环境正常可滑动，测试环境不可滑动
React Mobile Picker 使用教程
最新发布
gitblog_00519的博客
09-11 677
React Mobile Picker 使用教程 react-mobile-picker An iOS like selector/picker component for web 项目地址: https://gitcode.co...
关于pickerView滑动不了的问题
weixin_44013124的博客
11-09 1493
因为一些需求原因，最近做的项目使用pickerView并且要自己写个弹框让其弹出来。在开发过程中遇到一个问题：数据源data以及初始值value在仔细检查过都没有格式、类型错误等，但就是点开这个弹框时，初始值定位不准，并且滑动一下之后再也滑动不了了。 最后发现是display这个css属性导致的。因为初进页面，这个弹框的style是display：none，然后手动选择之后将属性通过选择器改为 display:block。猜想是由于高度问题导致pickerview无法刷新...
antd 下拉框不跟着滚动走
qq_43691078的博客
06-05 1284
在使用阿里的ant design vue框架时，使用下拉菜单a-select等组件，用在a-model组件上，发现垂直滚动的时候，a-select不会跟着走，停留在原地 a-select这么写可以解决 a-date-picker这么写可以解决 或者手动指定到对应节点上也可以 ...
antd-mobile中picker缺少key解决办法
aliven1的博客
09-08 550
使用的组件是Picker 提示弹出层缺少key,给数据源中的div加上key就好了，官方文档的示例中并没有加key PickerWrapper.defaultProps={ colorValue:['#00FF00'], colors:[ { label: (<div key="#FF0000"> <span style={{ ...colorStyle, backgroundColor: '#FF0000' }
R-Design:基于 react native 和 Ant Design Mobile 的移动端UI组件设计库
05-18
在这里首先十分感谢蚂蚁金服ant design mobile团队开发的UI Widget，可以说十分方便了，但是使用过程中还是有不少问题，例如部分组件修改样式不方便或者说组件的部分样式无法修改，输入框在RN环境下使用时clear按钮...
antd 日期时间选择_antd-mobile的DatePicker日期选择组件使用
weixin_39550940的博客
12-21 6163
现在项目上有个需求，在时间选择上需要精确到分钟，且分钟只能是0分钟或者是30分钟。其中组件有个minuteStep参数，将其设置成30，即可只显示0分钟或者30分钟了。但是在选择的时候发现了问题，点击时间控件，弹出时间选择的界面，如果不去选择0分钟或者30分钟，直接点击确认，控件会选择到当前时间的分钟数，这是不合理的，解决方法：参考了https://www.zhihu.com/question/5...
antd-mobile按需加载样式和自定义样式
weixin_34259559的博客
12-24 4660
antd-mobile 引入css的样式的两种方式 在入口处引入样式 // 一般入口文件是index.js import 'antd-mobile/dist/antd-mobile.css'; // or 'antd-mobile/dist/antd-mobile.less' 或者下面这种方式引入样式 和上面的方法不同的地方就是，上面是...
【React】解决antd中，select和DatePicker组件不跟随页面滚动的问题
qing_小诺的博客
06-05 5803
解决方案： 1、在Select组件中： 添加“getPopupContainer={triggerNode => triggerNode.parentNode}” ，使其固定在父元素中 <Select getPopupContainer={triggerNode => triggerNode.parentNode} defaultValue="lucy" styl...
ant-design/react-native 使用Picker组件点击无效
欢迎进入小洋的博客！
12-15 1636
问题描述： ant-design/react-native 使用Picker组件点击无效 解决方案： <Picker data={data} value={this.state.value} cols={1} onOk={(v) => this.ok(v)} > // 需要在这里添加内容 <IconComp color="#ffffff" size={25} name="ios-menu" /> </Picker> ...
关于picker等插件影响后层滑动问题
weixin_44013124的博客
10-20 449
弹框弹出时页面会出现遮罩层。发现在遮罩层滑动时后面的页面也跟着滑动，于是在浏览器上查看相关元素，发现该插件自动给body标签的overflow:hidden属性没有起作用。经过验证发现给body加入position:fixed时滑动遮罩层后面的不跟着滑动。于是采用picker的自带属性onVisibleChange。使用方法： onVisibleChange(v) { console.log('onVisibleChange', v) if (v === t...
antd picker 使用 如何_教程27——antd 的配置
weixin_39917211的博客
12-29 705
前言：用的较多的一个 ui 框架就是 atn.design Ant Design - 一套企业级 UI 设计语言和 React 组件库​ant.design一、什么是 antd 及用法antd是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。特性： 提炼自企业级中后台产品的交互语言和视觉风格。 开箱即用的高质量 React 组件。 使用 Typ...
React 使用Picker选择器实现单项选择列表
weixin_42260975的博客
02-24 3802
React 使用Picker选择器实现单项选择列表 一、功能描述 效果描述：通过选择不同的选项，按对应的选择顺序展示数据 效果图： 二、实现方法 <Picker data={orderData} // 数据源 cols={1} //列数 value={_self.state.sValue} //值 onOk={v => _sel...
React-Component/Picker 开源项目教程
gitblog_00579的博客
08-22 665
React-Component/Picker 开源项目教程 picker项目地址:https://gitcode.com/gh_mirrors/pick/picker 项目介绍 React-Component/Picker 是一个基于 React 的日期和时间选择器组件库。它提供了丰富的功能和灵活的配置选项，使得开发者可以轻松地在项目中集成日期和时间选择功能。该组件库支持多种选择模式，包括日期选...
react月份选择控件_一个移动端 react 的日期选择器
weixin_36150355的博客
12-30 388
react-mobile-datepicker a lightweight react date picker for mobile, Not more than 4kreact-mobile-datepicker provides a component that can set year, month, day, hour, minute and second by sliding up ...
antd 页面滚动下拉框不动问题
Jack_error的博客
03-24 2421
antd处理下拉框不随页面滚动问题 在antd中下拉框组件有很多比如： Select、SelectTree、DatePicker等，在点击后会出现下拉选择框，但是当我们华东页面时，会发现下拉框固定不动。 下面我给大家讲一下解决办法吧！ 分析 原因： 我们查看antd关于下拉选择时不难发现有个api叫 可以看到默认是挂到body的新建div上 但一般我们使用下拉选择框时，都会有父节点 包裹着选择组...
React Native 的 ant-design-mobile-rn 3.1.1 UI组件库
标签部分“reactnative rn antd react-natvie antd-mobile-rn”列出了关键词，其中“reactnative”和“rn”都指代 React Native，说明该组件库与 React Native 的紧密联系；“antd”是 Ant Design 的缩写，而“react...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值