随笔分类 -  React

有关React的一些学习记录
Pag动画：umi+libpag+copy-webpack-plugin实现及问题解决
摘要：1、package.json添加如下，安装依赖： "libpag": "^4.2.84", "copy-webpack-plugin": "9.1.0", 为什么是写死的旧版本，后面解释 2、使用的方法，这里只是一个小示例，具体如何使用看个人（这里主要是想记录过程中出现的问题及解决方式）： cons 阅读全文
posted @ 2024-07-26 15:03 桃李子 阅读(237) 评论(0) 推荐(0)
react实现某个元素节点截图（html2canvas）
摘要：1.安装所需插件：html2canvas； 2.引入插件： import html2canvas from 'html2canvas'; 3.使用： const creatImg = () => { // 绑定在某个点击事件 html2canvas(document.getElementById(' 阅读全文
posted @ 2022-07-14 17:05 桃李子 阅读(1192) 评论(0) 推荐(0)
react导入的插件不支持服务端渲染报错的解决方法
摘要：正常的导入方法如下： import { useEffect, useState, useRef } from 'react'; 如果不支持服务端渲染的插件这样导入则会报错（具体的报的什么错我忘了），一般情况下使用require动态导入就好了，但有的时候不支持require的方式导入，这时候就可以用以 阅读全文
posted @ 2022-06-10 15:50 桃李子 阅读(127) 评论(0) 推荐(0)
react复制文案到剪切板
摘要：这里使用别人写好的插件。 1.安装要用到的插件：copy-to-clipboard； 2.导入： import copy from 'copy-to-clipboard'; 3.使用： copy(copyStr); // copyStr为被复制的字符串 阅读全文
posted @ 2022-06-10 15:08 桃李子 阅读(266) 评论(0) 推荐(0)
react实现转盘动画
摘要：转盘动画方法如下： /** * 点击转动转盘 */ const turnCircle = () => { let runDeg = +(Math.random() * 360).toFixed(0) + 2160; // 先转6圈，最后再转随机的0-1圈 const table = document 阅读全文
posted @ 2022-06-10 14:58 桃李子 阅读(280) 评论(0) 推荐(0)
React antd Form表单项自定义组件
摘要：父组件 import React from 'react'; import Son from './Son'; const Farther = (props) => { const [form] = Form.useForm(); const { Item } = Form; return ( <d 阅读全文
posted @ 2021-09-03 15:46 桃李子 阅读(3017) 评论(0) 推荐(0)
react antd table自定义分页
摘要：<Table style={{ marginTop: 20 }} columns={columns} dataSource={dataSource} rowKey={record => record.id} pagination={{ // 具体配置可看antd官网文档Pagination的API部 阅读全文
posted @ 2021-09-02 15:31 桃李子 阅读(3239) 评论(0) 推荐(0)
React字符串关键字替换样式
摘要：const keyword = '关键字'; let str = '把关键字换成蓝色'; const reg = new RegExp(`${keyword}`, 'g'); str = str.replace(reg, `<span style='color: #1B73E8;'>${keywor 阅读全文
posted @ 2021-08-31 15:55 桃李子 阅读(852) 评论(0) 推荐(0)