react里面怎么实现换行


前言

提示:这里可以添加本文要记录的大概内容:

与在html中换行中的&nbsp方法不一样


`

一、怎么换行?

第一种方法我们可以使用
<br/>来尝试换行
或者第二种方法如下
拿用户登录界面举个例子:
比如要对用户名和密码、登录这3个做一个换行,需要单独用一个div把密码输入框给包起来,就可以实现换行。

<div style={{ whiteSpace: "pre-wrap" }}>
密   码:<input onChange={this.savePassword} type="password" name="password" />
</div>
            render() {
                return (

                    <form onSubmit={this.handleSubmit}>
                        用户名:<input onChange={this.saveUsername} type="text" name="username" />
                        <div style={{ whiteSpace: "pre-wrap" }}>
                            密   码:<input onChange={this.savePassword} type="password" name="password" />
                        </div>
                        <button>登录</button>
                    </form>
                )
            }

onChange和onclick的区别
1、使用情景不同
OnChange经常用于select下拉列表选中后的内容发生改变时候触发
OnClick表示的是点击该控件时触发

2、含义不同
OnChange:当控件的内容发生改变时触发该事件
OnClick:点击该控件时触发

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐