我要评论react ant-design select组件下拉框map不显示
问题描述
在使用select option下拉组件时，map遍历后不显示下拉框
- 错误写法：
{datalist && datalist.map(item =>{(
<option key={item.id} value={item.value}>{item.value}</option
)})}- 正确写法：
{datalist && datalist.map(item =>(
<option key={item.id} value={item.value}>{item.value}</option
))}心得
主要是es6箭头函数写法的问题，当需要在嵌套中写入html代码时，箭头函数后边不需要加大括号{}，直接用小括号()即可
在render()函数内使用大括号{}会识别成函数从而不会渲染到页面上，小括号内的内容会识别成代码块正常渲染
点击antd select下拉框时unable to preventdefault inside passive event listener invocation.
最近在写一个项目，用到了antd的下拉框，点击的时候发现控制台报这个错误：
unable to preventdefault inside passive event listener invocation
各种查资料，汇总了几种解决方法
只有第三种起作用，可能是和我的项目有关：
1.在addeventlistener增加第三个参数{ passive: false }，在报错的组件里并没有用到这个
2.设置全局样式: touch-action:none ，也不起作用
3.去掉插件 default-passive-events，浏览器控制台会有错误告警。。
警告如下：
usetouchmove.js:154 [violation] added non-passive event listener to a scroll-blocking 'wheel' event. consider marking event handler as 'passive' to make the page more responsive.
真是出了一个坑，又掉进另外一个坑。
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持代码网。
发表评论