将值设置为带有钩子和 redux 材料 ui 的文本字段

Question

我正在使用react，redux和redux-saga构建一个应用程序。 情况是我从 API 获取信息。在本例中，我正在获取有关电影的信息，我将使用基本表单更新此信息。 我希望在我的文本字段中包含的是我从数据库中调用的电影对象的值。 这是我代码的简短部分： 我以"名称"为例。 父组件：

const MovieForm = (props) => {
const {
movie,
} = props;
const [name, setName] = useState('');
const handleSubmit = (e) => {
e.preventDefault();
onSubmit({
name,
});
};
const handleSetValues = () => {
console.log('hi');
console.log(movie, name);
setName(movie.name);
setValues(true);
};
useEffect(() => {
if (movie && values === false) {
handleSetValues();
}
});
return (
<Container>
<TextField
required
**defaultValue={() => {
console.log(movie, name);
return movie ? movie.name : name;
}}**
label='Movie Title'
onChange={(e) => setName(e.target.value)}
/>
</Container>
);
};
export default MovieForm;
....

子组件

const MovieUpdate = (props) => {
const { history } = props;
const { id } = props.match.params;
const dispatch = useDispatch();
const loading = useSelector((state) => _.get(state, 'MovieUpdate.loading'));
const created = useSelector((state) => _.get(state, 'MovieUpdate.created'));
const loadingFetch = useSelector((state) =>
_.get(state, 'MovieById.loading')
);
const movie = useSelector((state) => _.get(state, 'MovieById.results'));
useEffect(() => {
if (loading === false && created === true) {
dispatch({
type: MOVIE_UPDATE_RESET,
});
}
if (loadingFetch === false && movie === null) {
dispatch({
type: MOVIE_GET_BY_ID_STARTED,
payload: id,
});
}
});
const updateMovie = (_movie) => {
const _id = id;
const obj = {
id: _id,
name: _movie.name,
}
console.log(obj);
dispatch({
type: MOVIE_UPDATE_STARTED,
payload: obj,
});
};
return (
<div>
<MovieForm
title='Update a movie'
buttonTitle='update'
movie={movie}
onCancel={() => history.push('/app/movies/list')}
onSubmit={updateMovie}
/>
</div>
);
};
export default MovieUpdate;

然后，实际问题是，当我在文本字段上使用默认属性时，信息显示没有任何问题，但如果我使用defaultValue它是空的。

Answer 1

好的，我有点得到答案，我在某处读到默认值不能用于渲染。 所以我在某种程度上作弊，我设置了属性多行和 row={1}(根据 material-ui 文档(，我能够编辑这个字段并接收一个值以在文本字段中显示它