我以前在博客上写过创建自己的sapwebide向导。在那个博客中，云上，我只使用了SAP提供的向导步骤，您可以使用和自定义这些步骤：

https://blogs.sap.com/2017/12/07/create-your-own-sap-web-ide-template-configure-the-wizard/

现在，在本博客中，我将向您展示如何在自定义向导中创建自定义向导步骤？一个完整的自定义向导步骤将允许您拥有完全的控制权和做任何您喜欢的事情。

本博客包含以下部分：

创建扩展创建向导创建自定义向导步骤使用向导中的自定义向导步骤在向导步骤中存储值

让我们从第一部分开始。

我们以与自定义向导相同的方式开始，并创建一个新的SAP Web IDE扩展项目。文件->新建->模板中的项目->SAP Web IDE扩展

给扩展名起一个类似"MyCustomWizardStep"

为扩展名和说明填写一个技术名称+扩展名和说明中第一个插件的名称：

现在，使用现有模板为向导创建一个起点：右键单击插件的创建文件夹->新建->现有模板的模板

正如旁注：向导是用来生成项目的，新手建站教程，所以它使用的模板文件将根据向导中的配置有不同的输出。

给出一个例子模板的名称和描述。该名称将用于在菜单或"新建项目向导"中显示向导名称。

我将为组件而不是新项目创建一个向导，我只使用"常规"类别。

作为模板的起点，我将使用"SAPUI5视图"。这是一个很好的基本示例，大数据查询，可以帮助您理解模板的工作原理，并且很容易开始使用。

让我们看看SAP Web IDE已经为我生成了什么。右键单击包.json->Run->Run As SAP Web IDE Extension

右击一个现有的UI5项目（或创建一个新项目）->new->您将看到新创建的向导的名称。

单击它，您将看到以下消息…

不要担心，这是正常的。我们来解决这个问题吧？

前往插件.json

并添加以下服务：

如果您再次运行它或在调试中使用SAP Web IDE刷新浏览器窗口，启动向导时将获得以下视图

这就是乐趣的开始，我将创建一个自定义向导步骤。第一步，创建一个控件。控件将包含自定义向导步骤的布局和逻辑。右键单击文件夹"control"->New->File

为文件指定与自定义向导步骤相同的名称：

在文件中输入以下代码。在此代码中发生以下情况：

从WizardStepContent扩展Init将使用SAPUI5控件创建布局并将其添加到内容中_createPageContent只是我自己的函数，用来生成布局，init函数

会调用这个布局，只是为了演示，我只需要添加一个标签

除了控件，我还需要创建一个服务。右键单击"服务"文件夹->新建->文件

使用与您用于控件的名称相同的名称以保持简单。

在其中粘贴以下代码。此代码将创建控件的实例并从中生成向导步骤。

您现在已经创建了自己的向导步骤。接下来，我们将在向导中使用此步骤。

向导步骤已准备就绪。我只需要配置我的向导来使用我的自定义向导步骤。

在插件.json像这样：

工具应该永远是"sap.watt.common公司.服务.ui.WizardStep"模块包含自定义向导步骤服务的路径

将服务添加为向导步骤，名称为您在上一配置中用于定义服务的名称：

再次测试时，淘客模板，您将在向导的第一步上看到我们的标签！

我们可以使用绑定在步骤之间共享数据。如果我们将标签更改为输入字段，并将其绑定到模型中的"CustomInputValue"字段，如下所示：

如果您现在进行测试，您将注意到您无法单击"下一步"按钮：

我们需要触发带有参数isValid的事件验证为true

然后，您可以点击"下一步"按钮：

我们可以通过访问此.getModel（）.getProperty（"/CustomInputValue"）"。最后，向导将在我的自定义向导.js"文件（根据向导的名称可以不同）。在这个函数中，您将模型作为参数：

这就是创建自己的向导步骤所需要知道的全部内容。我将此方法用于新版本的自定义控件生成器：

https://blogs.sap.com/2018/09/04/ui5-control-generator-v2-sap-web-ide-template/

玩得开心，云报，创建自己的向导！