【AntDesignPro】Ant Design Pro学习记录—播放视频和音频

在ant design pro中，使用video和audio标签播放视频和音频1、播放视频我使用ModalForm弹框显示，autoPlay设置是否自动播放，controls设置操作按钮是否显示，设置好宽度和高度即可src是配置视频文件的链接<ModalForm         title="播放视频"        &n

发表于：2024-05-17 浏览：454 TAG：

【AntDesignPro】Ant Design Pro学习记录—DrawerForm的使用

在AntDesignPro中，ModalForm和DrawerForm是我最常用的两个表单组件，配置上，他们有很多相同的地方，也有差异的地方，相比较而言，DrawerForm我使用的更多。ModalForm<ModalForm         title={标题}         width={600}   &n

发表于：2024-05-17 浏览：470 TAG：

【React】react页面加载远程css和js

在React中，您可以使用componentDidMount生命周期方法来动态加载远程CSS和JavaScript文件。代码如下import React, { Component } from 'react';   class DynamicResources extends Component {   componentDidMount()&nbs

发表于：2024-05-15 浏览：275 TAG：

【React】如何在 React 类中声明常量？

使用 react 开发应用程序时，有必要声明常量来存储在组件或应用程序的整个生命周期中保持不变的值。常量可以帮助提高代码可读性，提供管理共享值的中心位置，并增强可维护性。在本文中，我们将探讨如何在 react 类组件中声明常量。导入 React首先，我们假设您已经设置了 React 环境并且有一个可供使用的类组件。在声明常量之前，请确保您已导入必要的库。这包括导入 React，它是在 React 中构建用户界面的核心库。import React from '

发表于：2024-04-16 浏览：305 TAG：

【React】使用React实现一个内容滑动组件

最近在做项目时遇到一个需求，需要让一个列表能够通过点击按钮进行滚动，每次都是一屏的距离，不足则结束。并且，这个列表项是在react-grid-layout中的某一个模块内。所以包裹这个列表的容器会随时发生变化。在完成这个组件后，通过这篇文章总结一下。UI/原型分析那么从上面的功能描述以及项目中的UI，我们可以分析得到这样一个假想图：我们需要实现一个容器来作为我们的可视区域，并且这个容器是可以伸缩的。列表内容如果超出容器的可视区域，那么就会被隐藏。需要左右都有按钮，来支持用户左右滑动内容来查看，每

发表于：2024-04-10 浏览：332 TAG：

【React】 react 绘制矩形

在React中绘制矩形，可以使用HTML5的<canvas>元素结合React组件的生命周期方法来实现。以下是一个简单的React组件示例，用于绘制矩形：import React, { Component } from 'react';   class Rectangle extends Component {   componentDid

发表于：2024-04-01 浏览：315 TAG：

【React】16 个实用的 React 库

Web开发中，经常会需要使用第三方库来提高开发效率。今天给大家分享16个非常实用的React第三方库，使用好这些库你可以更轻松、更快速的开发项目，让我们一起看看吧！1.react-hook-formReact-hook-form 是一个用于构建 Web 应用程序的表单库。它支持多种表单类型，包括输入框、下拉框、单选框、多选框等。它还提供了一些自定义选项，可以自定义表单的外观和行为。官方地址：https://react-hook-form.com/2.rechartsRecharts 是一个用于构

发表于：2024-04-01 浏览：306 TAG：

【React】React前端图片裁剪组件

前端图片裁剪组件前端图片裁剪已经是很常见的需求了，在 react 的项目中推荐使用 react-image-crop 库，能勾勒出裁剪区域、宽高比例限制等等，但是还是有很多东西需要我们来做的，比如以下问题：react-image-cropreact-image-crop 的基本使用import ReactCrop from "react-image-crop"; import "react-image-crop/dist/Re

发表于：2024-03-29 浏览：312 TAG：

【AntDesignPro】Ant Design Pro学习记录—ModalForm的使用（四）

一、 ModalForm自定义footer按钮参考官网，Modal弹框是可以自定义按钮的，原想着ModalForm的modalprops可以设置自定义footer，结果设置一直不生效，最终还是使用Modal嵌套了ProForm实现了功能，在此记录一下。ant design pro使用的V5版本。1、Modal自定义footer参考官网https://ant-design.antgroup.com/components/modal-cn?from=msidevs.net#components-mo

发表于：2024-02-20 浏览：363 TAG：

【AntDesignPro】Ant Design Pro学习记录—ModalForm的使用（三）

一、 Form.useForm()的使用之前使用表单的时候，一直在为表单赋值纠结，找了一些资料，也感觉很复杂，使用多了之后，感觉表单赋值也挺简单的。1、 创建一个formconst [theForm] = Form.useForm();2、 绑定表单组件无论是ProForm、ModalForm、还是DrawerForm，都可以绑定我们的theForm，使用属性form={theForm}绑定，代码如下<ProForm    &nb

发表于：2024-02-20 浏览：476 TAG：