首页 > 解决方案 > 再次反应 useState 初始化值

问题描述

我正面临一个奇怪的问题。我正在使用 redux 并做出反应。当从 store 获取新道具时,react useState 再次初始化我的数据。文档说 useState 初始值仅在第一次渲染中,但我不明白为什么会这样

function UploadFileInfo({
createdCategory
}){
const [data, setData] = useState({
    video_id: null,
    title: 'title',
    category_id: '2',
    channel_category_id: '',
    info: '',
    tags: [],
    playlists: '',
    enable_comments: 0,
    enable_watermark: false,
    banner_id: null,
  });
return (
    <Paper square className={classes.paper}>
    </Paper>
  );
const mapStateToProps = createStructuredSelector({
  tags: makeSelectTags(),
  categories: makeSelectCategories(),
  createdTag: makeSelectCreateTag(),
  createdCategory: makeSelectCreateCategory(),
  createdPlaylist: makeSelectCreatedPlaylist(),
  myCategories: makeSelectMyCategories(),
  myPlaylists: makeSelectMyPlaylists(),
  uploadedFile: makeSelectUploadFile(),
});

function mapDispatchToProps(dispatch) {
  return {
    dispatch,
    addTag: title => dispatch(createTag(title)),
    addCategory: title => dispatch(createCategory(title)),
    addPlaylist: title => dispatch(createPlaylist(title)),
    publishVideo: data => dispatch(createVideo(data)),
  };
}

const withConnect = connect(
  mapStateToProps,
  mapDispatchToProps,
);

export default compose(withConnect)(UploadFileInfo);
}

标签: reactjsreduxreact-hooks

解决方案


您可以使用useEffect. 它类似于componentDidMountcomponentDidUpdate反应生命周期。如果某些值发生变化,您可以告诉反应重新渲染页面。您可以在useEffect函数的 [] 中定义这些值

useEffect(()=>{
    setData({
       //set data in here 
    })
  
  },[addTag,addCategory, //values that get changed])

推荐阅读