react
ze1024
一起学习,一起进步
展开
-
antd实现通过select搜索下拉,如果无搜索条件的下拉,那么回车把刚刚输入的内容添加成下拉选项
深拷贝相关内容原创 2021-12-01 17:36:27 · 3362 阅读 · 0 评论 -
react hook的各种功能
react hook的各种功能React目前提供的Hookhook 用途useState 设置和改变state,代替原来的state和setStateuseEffect 代替原来的生命周期,componentDidMount,componentDidUpdate 和 componentWillUnmount 的合并版useLayoutEffect 与 useEffect 作用相同,但它会同步调用 effectuseMemo 控制组件更新条件,可根据状态变化控制方法执行,优化传值原创 2021-11-30 14:23:48 · 381 阅读 · 0 评论 -
antd DatePicker 日期限制选择
function disabledDate(current) { // return current && current >= moment().endOf('day'); // 选择时间要大于等于当前天。若今天不能被选择,去掉等号即可。 // 限制为前后一周 return current < moment().subtract(7, 'days') || current >= moment().endOf('da...原创 2021-09-29 10:45:38 · 1132 阅读 · 0 评论 -
fetch处理数据流下载
平时开发react项目,用的是fetch做的接口请求平时用的比较多的是json格式的,以为之前他们已经做过接口请求了,我没在意,这次做一个文件下载,和之前的不太一样,返回的数据流所以又重新看了一遍文档解决的平时使用 处理json数据返回fetch('http://example.com/movies.json') .then(function(response) { return response.json(); //处理json数据返回 }) .then(function(myJ原创 2021-05-29 15:15:40 · 1011 阅读 · 0 评论 -
动态实现选中取消功能
html <div className="main-style"> { mockData && mockData.length > 0 && mockData.map((item, index) => { return <div key={item.id} className={item.select ?原创 2021-05-28 15:40:11 · 121 阅读 · 0 评论 -
antd Input组件通过onChange事件获取输入内容时e.target.value为null
问题背景:使用antd组件,想写一个输入框,没有用form,仅使用antd里面中Input组件,结果使用onChange时,获取到内容为null解决方法:如下 //获取输入框内容 function inputChange(e) { dispatch({ type: 'TagManageModel/concat', payload: { inputValue: e || '' }, }); } <Input原创 2021-04-01 16:22:47 · 6259 阅读 · 2 评论 -
js 相关日期的函数
获取年月日//获取年月日export function getNowFormatDate() { var date = new Date(); var seperator1 = "-"; var year = date.getFullYear(); var month = date.getMonth() + 1; var strDate = date.getDate(); if (month >= 1 && month <= 9) { mont原创 2021-03-05 14:26:34 · 76 阅读 · 0 评论 -
vue和react 动态渲染div的宽度
react 动态渲染div的宽度react里面使用map遍历,动态渲染 {dataList && dataList.length > 0 && dataList.map((item, index) => { return <div key={index}> <div className="bgcolor" style={{ "width": `${item.length}%` }}>原创 2020-10-21 15:32:29 · 1260 阅读 · 0 评论 -
react写h5 使用antd-mobile的Carousel 走马灯控制台报错Unable to preventDefault inside passive event listener due t
最近在用react 写h5移动端,使用的ui库就是antd-mobile,在使用 Carousel的时候 滑动报错了,如下查阅了写文章问题原因由于浏览器必须要在执行事件处理函数之后,才能知道有没有掉用过 preventDefault() ,这就导致了浏览器不能及时响应滚动,略有延迟。 所以为了让页面滚动的效果如丝般顺滑,从 chrome56 开始,在 window、document 和 body 上注册的 touchstart 和 touchmove 事件处理函数,会默认为是 passive:原创 2020-08-15 17:26:35 · 1827 阅读 · 4 评论 -
react使用动态添加类名className和样式
一般我们实现css 的时候 会给一个class添加多个样式 比如<div class="class1 class2">HELLO WORLD</div>但是如果你在jsx文件里,通过import的形式引入的less,那么就不能这么写了,那么这时候想实现上面的效果怎么办,如下React实现 双类名/多类名方法一// React实现 双类名/多类名import styles from './styles.less';// 常用// (字符串写法)<div原创 2020-08-15 17:12:54 · 16558 阅读 · 0 评论