[英]TypeError: Cannot read properties of undefined (reading 'string') with react joi-browser package
I have a problem with validating a form in react.我在验证表单时遇到问题。 I have a register form in my react beginner project as follows:
我的 React 初学者项目中有一个注册表单,如下所示:
import React from "react";
import Form from "./common/form";
import { Joi } from "joi-browser";
import * as userService from "../services/userService";
class RegisterForm extends Form {
state = {
data: { username: "", password: "", name: "" },
errors: {}
};
schema = {
username: Joi.string().required().email().label("Username"),
password: Joi.string().required().min(5).max(15).label("Password"),
name: Joi.string().required().label("Name")
};
doSubmit = async () => {
await userService.registerUser(this.state.data);
};
render() {
return (
<div>
<h1>Register</h1>
<form onSubmit={this.handleSubmit}>
{this.renderInput("username", "Username", "email")}
{this.renderInput("password", "Password", "password")}
{this.renderInput("name", "Name")}
{this.renderButton("Register")}
</form>
</div>
);
}
}
export default RegisterForm;
as you can see i am using joi-browser package for validating my inputs but on the front i have the following error:如您所见,我正在使用 joi-browser 包来验证我的输入,但在前面我有以下错误:
TypeError: Cannot read properties of undefined (reading 'string') new RegisterForm E:/computer/Web/React,js/06 - Routing (00h53m)/1- Resources/Resources/Section 6- Routing/start/vidly/src/components/registerForm.jsx:11 8 |
类型错误:无法读取未定义的属性(读取“字符串”)新的 RegisterForm E:/computer/Web/React,js/06 - Routing (00h53m)/1- Resources/Resources/Section 6- Routing/start/vidly/src/组件/registerForm.jsx:11 8 | errors: {} 9 |
错误:{} 9 | };
}; 10 |
10 | schema = {
架构 = {
11 |
11 | username: Joi.string().required().email().label('Username'), 12 |
用户名:Joi.string().required().email().label('用户名'), 12 | password: Joi.string().required().min(5).max(15).label('Password'), 13 |
密码:Joi.string().required().min(5).max(15).label('Password'), 13 | name: Joi.string().required().label("Name") 14 |
名称:Joi.string().required().label("名称") 14 | };
};
please help me anyone请帮助我任何人
change the line换行
import { Joi } from "joi-browser";
to到
import Joi from "joi-browser";
and that should solve the error.那应该可以解决错误。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.