Material ui 如何在单个材质UI步进器步骤(步进器步骤中的步骤[父步骤中的子步骤])中实现嵌套步骤 我想在材质UI步进器组件中使用嵌套的步骤组件

Material ui 如何在单个材质UI步进器步骤(步进器步骤中的步骤[父步骤中的子步骤])中实现嵌套步骤 我想在材质UI步进器组件中使用嵌套的步骤组件,material-ui,stepper,formik-material-ui,Material Ui,Stepper,Formik Material Ui,这就是我所追求的行为。我在NextJS上下文中使用materialui和Formik。我用它作为参考 线框图 下面是一些线框,有助于说明三个顶级父步骤中的每个步骤,第三个屏幕截图说明最后一个父步骤(步骤3)有三个嵌套的子步骤 父步骤一-告诉我们您的财产无子步骤 这是表单中的第一步。客户将提供有关将制作媒体的土地或站立结构的信息(取决于选择,某些产品将不是他们可以选择的选项) 屏幕截图1:这是表单中的第一步 父步骤二-选择包含多个产品和包的门户网站上的服务 这一步实际上是查看分类产品的非线性门户

这就是我所追求的行为。我在NextJS上下文中使用materialui和Formik。我用它作为参考

线框图 下面是一些线框,有助于说明三个顶级父步骤中的每个步骤,第三个屏幕截图说明最后一个父步骤(步骤3)有三个嵌套的子步骤

父步骤一-告诉我们您的财产无子步骤 这是表单中的第一步。客户将提供有关将制作媒体的土地或站立结构的信息(取决于选择,某些产品将不是他们可以选择的选项)

屏幕截图1:这是表单中的第一步

父步骤二-选择包含多个产品和包的门户网站上的服务 这一步实际上是查看分类产品的非线性门户。有四个服务类别,包括产品和子包。目标是能够挑选产品并将其添加到购物车中

屏幕截图2:这是主页/门户

父步骤三-提供一些信息3子步骤 这一步实际上是查看分类产品的非线性门户。有四个服务类别,包括产品和子包。目标是能够挑选产品并将其添加到购物车中

屏幕截图3:这是我们在3个子“步骤”中收集信息的地方

下面是Material Ui Stepper组件的详细信息。

依赖项/环境
  • 我将回购作为一个起点:
  • 我正在使用Formik材质UI:
  • 我想使用带有嵌套步骤的Material UI Stepper组件:

  • 教程的创建者布鲁诺·安图内斯回复了视频上的评论,并在回复帖中给出了提示。新方法:基于与bruno的Conva,我将尝试使用视频教程的repo,并尝试@bmvantunes建议的实现。计划是尝试在Stepper父组件中包含7-8个步骤组件,并且仅在UI顶部显示我的“三大”步骤。