今朝有熊

课程目标 本节课程将学习如何使用 Formik 提供的 Field 组件，将表单输入框和错误提示封装成一个通用的组件，以减少重复代码，并提升代码的复用性和可维护性。 1. 为什么要封装？ 在上一节中，

课程目标 上一节中，我们已经使用 Formik 完成了登录表单的基本功能。本节将学习如何使用 Yup 库为表单添加校验规则，确保用户输入的数据合法。 1. 安装 Yup Yup 是一个专门处理规则校验

课程目标 本节课程将学习如何使用 Formik 组件构建登录页面的表单功能，包括表单初始化、事件处理和表单提交等内容。 1. 登录页面设计 登录页面的设计非常简单，包含以下内容： 两个输入框：账号 和

在本节中，我们完成了账号模块的功能，以下是登录页面的实现： 一、创建登录页面组件 创建 Login 组件 在 pages 文件夹下创建 Login 文件夹，并添加 index.tsx 文件： 创建自定

在本节中，我们将创建账号模块的 Model，用于管理用户的登录和登出逻辑。以下是实现步骤： 一、YAPI 接口配置 登录接口： 请求方法：POST 请求地址：/mock/11/login 请求参数：

一、功能介绍 表单校验： 使用 Formik 和 yup 管理表单数据和校验规则。 表单包含账号和密码输入框，校验输入是否为空。 自定义输入控件： 封装自定义的输入控件，支持错误提示显示。 登录状态管

在上一节中，我们已经实现了视频播放功能，但目前存在一个问题：点击多个视频时，这些视频会同时播放。我们需要控制只让一个视频播放。以下是实现步骤： 一、控制视频播放状态 1. 修改 Found 组件 在

在上一节中，我们完成了发现模块的数据请求逻辑。在本节中，我们将实现数据的展示功能。 一、创建发现页面组件 创建 Found 文件夹和组件 在 pages 文件夹下创建 Found 文件夹，并将 Fou

在这一节中，我们将创建发现模块的 Model，并了解其数据结构。以下是实现步骤： 一、数据结构 接口地址：/mock/11/bear/found/list 接口数据： 二、创建 Model 创建 fo