英文:
Facing issue while tried to created login form in react
问题
以下是翻译好的内容:
输入是一个无内容元素标签,不能包含“children”,也不能使用“dangerouslySetInnerHTML”。
<div>
<Modal show={this.state.show} handleClose={this.hideModal}>
<div className="blkOverlay">
{/* 这是登录表单,用于登录到您的个人资料 */}
<div className="formContent modal-main">
<h2>欢迎回来 <span>Brandon!</span></h2>
<form show={this.state.show} handleClose={this.hideModal}>
<input type="text" name="email" placeholder="电子邮件地址" />
<input name="password" type="text" placeholder="密码" passwordToggle="true" iconShow="eye" iconHide="eye-blocked" />
<div className="passContent">
<div className="checkingPass">
<input name="checkbox" type="checkbox"></input>
<p className="passFont">记住密码</p>
</div>
<p className="passFont">记住密码</p>
</div>
<input type="button" name="button">登录</input>
<div className="social-media-button">
<input type="button" name="button">使用Facebook登录</input>
<input type="button" name="button">使用Google登录</input>
</div>
<p className="passFont">还没有帐户? <span>创建一个帐户</span></p>
</form>
</div>
{/* 这是注册以创建帐户 */}
</div>
</Modal>
</div>
关于在ReactJS中创建表单以避免输入错误的正确方法,您可能需要检查您的表单元素和事件处理程序是否正确设置。此外,确保在React中使用的表单元素的值(如<input>
中的value
)受到组件状态的控制,并且与状态变化同步更新。如果您在表单方面遇到具体问题,请提出更具体的问题,以便获得更详细的帮助。
英文:
Input is a void element tag and must neither have children
nor use dangerouslySetInnerHTML
.
<div>
<Modal show={this.state.show} handleClose={this.hideModal} >
<div className="blkOverlay">
{/* This is Login Form to log in to your profile */}
<div className="formContent modal-main">n>
<h2>Welcome Back <span>Brandon!</span></h2>
<form show={this.state.show} handleClose={this.hideModal}>
<input type="text" name="email" placeholder="Email Address" />
<input name="password" type="text" placeholder="Password" passwordToggle="true" iconShow="eye" iconHide="eye-blocked" />
<div className="passContent">
<div className="checkingPass">
<input name="checkbox" type="checkbox"></input>
<p className="passFont">Remember Password</p>
</div>
<p className="passFont">Remember Password</p>
</div>
<input type="button" name="button">Login</input>
<div className="social-media-button">
<input type="button" name="button">Sign in with Facebook</input>
<input type="button" name="button">Sign in with Google</input>
</div>
<p className="passFont">Don't have an account? <span>Create a account</span></p>
</form>
</div>
{/* This is Sign up to create a account */}
</div>
</Modal>
</div>
What is the proper way to create a form in reactjs with getting this error about the input?
答案1
得分: 1
You should not put "Sign in with Facebook/Google" inside the input-tag. This is the reason why it is complaining about children. In React, a child is another tag inside a tag.
You should use:
<input type="button" value="Sign in with Facebook">
英文:
You should not put "Sign in with Facebook/Google" inside the input-tag. This is the reason why it is complaining about children. In React, a child is another tag inside a tag.
You should use:
<input type="button" value="Sign in with Facebook">
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论