![](/img/trans.png)
[英]How to manage multi Text Field validation in material-ui react?
[英]React material-ui text field screen shakes
我有一個簡單的反應代碼。 有一個材質-UI Textfield。
當我點擊文本框輸入數據時,屏幕抖動。 輸入數據后,我點擊外面,盒子屏幕震動。 請幫我解決這個屏幕抖動問題。 非常感謝。
import Grid from '@material-ui/core/Grid';
import TextField from '@material-ui/core/TextField';
import PropTypes from 'prop-types';
import React, { useState } from 'react';
const Login = props => {
return (
<div>
<Grid container spacing={2} justify="center">
<Grid item xs={12} container justify="center" spacing={2}>
<Grid item xs={3}>
<TextField
label="fd"
variant="outlined"
fullWidth
>
</TextField>
</Grid>
</Grid>
</Grid>
</div>
)
}
export default Login;
只需如下設置文本字段的onChange
屬性,抖動就會消失。
import React, { useState } from 'react';
import Grid from '@material-ui/core/Grid';
import TextField from '@material-ui/core/TextField';
import PropTypes from 'prop-types';
import React, { useState } from 'react';
const Login = props => {
const [name,setName] = useState("")
return (
<div>
<Grid container spacing={2} justify="center">
<Grid item xs={12} container justify="center" spacing={2}>
<Grid item xs={3}>
<TextField
label="fd"
variant="outlined"
fullWidth
onChange={e => setName(e.target.value)}
/>
</Grid>
</Grid>
</Grid>
</div>
)
}
export default Login;
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.