-
React-hook-form-mui（三）：表单验证
关键词 React MUI react-hook-form-mui前言在上一篇文章中，我们介绍了react-hook-form-mui的基础用法。本文将着重讲解表单验证功能。react-hook-form-mui提供了丰富的表单验证功能，可以通过validation属性来设置表单验证规则。本文将详细介绍validation的三种实现方法，以及如何与提交按钮联动。Demo以下是一个表单验证的 demo，我们将通过三种方法来实现表单验证：import React from "react";i...…
-
React-hook-form-mui （二）：表单数据处理
关键词 React MUI react-hook-form-mui前言在上一篇文章中，我们介绍了react-hook-form-mui的基础用法。本文将着表单数据处理。react-hook-form-mui提供了丰富的表单数据处理功能，可以通过watch属性来获取表单数据。Demo下面是一个使用watch属性的例子：import React from 'react';import { useForm } from 'react-hook-form';import { Button } f...…
-
React-hook-form-mui （一）：基本使用
关键词 React MUI react-hook-form-mui前言在项目开发中，我们选择了React+MUI作为技术栈。在使用MUI构建form表单时，我们发现并没有与antd类似的表单验证功能，于是我们选择了MUI推荐使用的react-hook-form-mui库去进行验证。但是发现网上关于这个库的使用方法和demo比较少且比较简单，并没有复杂的表单验证的demo。因此本文及以下几篇文章，会从简到难讲解如何使用。希望通过这几篇文章的介绍，能够帮助你入门react-hook-form...…
-
Angualar2+ 路由跳转，url不变
关键词 Angualar2+前言在项目开发的过程中，客户需要切换到无权限页面的时候，路由不变。当添加成功权限后，刷新页面即可访问。解决步骤当跳转路由时候，使用{ skipLocationChange: true } this.router.navigate(['/not-allowed'], { skipLocationChange: true });后言希望本文会对你有所帮助，如果有什么问题，可在下方留言沟通…
-
js处理IOS虚拟键盘弹出后输入框被遮住
关键词 JS IOS前言在项目开发的过程中，在IOS手机端系统下，当对输入框（input/textarea）进行focus操作时，键盘弹起遮住输入框。问题描述 从页面底部focus输入框失败 从页面中间focus输入框失败原因造成上述问题的：键盘弹起事件和输入框滚动到浏览器窗口的可见区域的事件有冲突。解决步骤根据不同的情况有不同的解决办法： 从页面底部focus输入框失败：使用scrollIntoView方法：该scrollIntoView()方法将调用它的元素滚动到浏览器窗口的可见...…