- 博客(12)
- 收藏
- 关注
原创 Antd Pro操作ProTable/Table实现拖动排序(sortablejs)
antd官方实现过于复杂,这里通过sortablejs来实现DOM结构<div className="draggableTable" ref={sortableTable}> <ProTable rowKey="id" request={params => loadXXX(params)} columns={columns} actionRef={tableRef} rowClassName={(record, index) =&g.
2021-09-14 21:36:01
1890
原创 React监听对象型State的变化&立即更新state
描述很多时候,我们需要在页面渲染之前先加载出需要呈现的state,如下面例子——在渲染Select组件前,首先先需要将point数组加载出来<Select placeholder="选择地点" onChange={(value) => { ... }}> { point.map((value, key) => <Select.Option value={value}>{value}</Select.Option> ) }
2021-09-07 20:57:14
9879
1
原创 React中useState值为对象时改变值不渲染
问题修改State并重新setState(arr)后,值改变,但并未重新渲染const [arr, setArr] = useState([])arr.push(1)setArr(arr)原因React中默认浅监听,当State值为对象时,栈中存的是对象的引用(地址),setState改变的是堆中的数据所以此时 setArr(arr) 后,栈中的地址还是原地址,React浅监听到地址没变,故会认为State并未改变,故没有重渲染页面解决思路:将栈中原arr所指向的地址改变即可1
2021-08-12 18:56:38
3922
原创 React结合Ant Design Pro开发项目理解(service、model、index等文件逻辑关系)
组件中传值react——值写在了视图层Antd pro——值写在model层,通过saveState扩展表达式,把值更新到state后会触发视图层的render方法【通过props获取model中的值】下图是整个项目各模块的关系大概流程是UI组件间的交互操作,首先调用Model中的effects,Model通过effects调用Service(封装了request请求)中的请求函数来发起请求,获取服务端返回的响应后,调用reducers来改变state,更新Viewservice文件编写对应
2021-08-06 20:04:48
1756
原创 React 将字符串解析为DOM元素
属性dangerouslySetInnerHTML={{__html: 字符串}}const str = "<div>我是要显示的DOM元素</div>"<div dangerouslySetInnerHTML={{__html: str}} />
2021-08-06 18:41:22
787
转载 设置overflow:hidden后,Radio元素与字体不在同一水平线
原因:行内元素默认vertical-align:baseline(基线对齐),设置overflow不为visible之后会改变他的基线为下边距边缘此时行内元素的基线与的基线不在同一水平线就发生了偏移解决方案:1)显示设置行内元素对齐方式为:vertical-align:top2)设置其他元素都为overflow:hidden3)设置元素float转载于:https://www.cnblogs.com/evaling/p/10702095.html...
2021-08-03 20:40:02
405
原创 React中使用Axios发起POST请求提交文件
通过Axios发起POST请求向后端提交文件首先,这里引入FormData——保存请求参数(为什么需要通过FormData来保存呢?)const formData = new FormData()formData.append('key', value)下面是Axios的post操作Axios({ headers: { 'Content-Type':'application/json' }, method: 'post', url:`后端url`, data: formData,
2021-07-29 15:56:58
4061
原创 React通过useRef获取对应的Dom/组件实例
步骤:1. 声明一个ref对象const formRef = useRef(false)2. 绑定对应的表单元素3. 通过formRef.current.validateFields().then(datas => {datas.name})获取
2021-07-29 11:37:08
1459
原创 Git上传代码到GitLab
Git上传代码到GitLab转载一下Git上传代码到GitLab的流程和相关问题解决大体流程:https://blog.youkuaiyun.com/qq_20663229/article/details/80413188最后push操作失败解决:https://blog.youkuaiyun.com/weixin_30321709/article/details/97459151...
2021-07-25 22:36:08
100
原创 CSS百分比应用的坑
前言CSS中以下属性常会应用到百分比,以下是对其的一些简单总结:width、height、border-radius、background-position、font-size、line-height、vertical-align、bottom、left、right、top、transform: translate1. width和height这个最常用也是最简单的了,它们的百分比计算是基于包裹它的父元素的宽和高来计算,比如:<div class="cube-container">
2021-06-07 15:51:27
540
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人