如何在一个地方加载多个组件,但数据不应更改哪个用户输入

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在一个地方加载多个组件,但数据不应更改哪个用户输入相关的知识,希望对你有一定的参考价值。

我有3个组件PersonalInfoComponentEducationalInfoComponentExperienceComponent。我在ResumeComponent加载所有这些组件。

当用户使用PersonalInfoComponent中的表单输入一些信息并转到EducationalInfoComponent并再次点击PersonalInfoComponent时,数据正在刷新,因为每次都会加载Components并重置表单。

我需要,用户只需填写每个组件中的所有信息,并一键提交所有数据。

提前致谢。

答案

在ResumeComponent中初始化三个变量personalInfo,educationalInfo和experienceInfo,并将它们分别作为输入传递给PersonalInfoComponent,EducationalInfoComponent和ExperienceComponent。将表单数据存储在这些变量中的子组件中,并将每个组件的ngDestroy存储在您发出事件以将该数据发送到父组件(ResumeComponent)并更新父组件中的变量。如果这样做,那么即使您从一个组件移动到另一个组件,您的数据也不会丢失。我希望我的回答很有帮助。 :)

以上是关于如何在一个地方加载多个组件,但数据不应更改哪个用户输入的主要内容,如果未能解决你的问题,请参考以下文章

Vue 计算属性已更新,但组件未重新渲染

Angular 2 根据用户输入重新加载当前组件

vue异步渲染

如何在使用Devise注册时创建新用户时添加或更新关联的属性?

如何动态加载多个苗条组件?

如何在同一个 React 组件中管理多个 setState 调用?