[UI5 常用控件] 08.Wizard,NavContainer

文章目录

  • 前言
  • 1. Wizard
    • 1.1 基本结构
    • 1.2 属性
      • 1.2.1 Wizard:complete
      • 1.2.2 Wizard:finishButtonText
      • 1.2.3 Wizard:currentStep
      • 1.2.4 Wizard:backgroundDesign
      • 1.2.5 Wizard:enableBranching
      • 1.2.6 WizardStep:validated
      • 1.2.7 WizardStep:complete
    • 1.3 跳转函数
      • 1.3.1 goToStep
      • 1.3.2 discardProgress
  • 2. NavContainer
    • 2.1 基本组成
    • 2.2 Page跳转
  • 3. 示例代码


前言

本章节记录常用控件 Wizard,NavContainer。

  • Wizard控件是一种用于分步导航和指导用户完成多步骤任务的界面控件。它通常用于创建复杂的表单或流程,其中用户需要按照一定的顺序完成多个步骤。Wizard控件可以将整个过程分解为一系列步骤,并允许用户逐步完成每个步骤。
  • NavContainer 是 SAPUI5 中用于实现页面导航的容器控件。它允许在同一个页面上管理多个子页面,并支持页面之间的导航。

其路径是

  • sap.m.Wizard
  • sap.m.NavContainer

1. Wizard

1.1 基本结构

<Wizard>
<WizardStep></WizardStep>
<WizardStep></WizardStep>
<WizardStep></WizardStep>
</Wizard>

1.2 属性

1.2.1 Wizard:complete

  • 当所有Step完成时提供Preview按钮绑定事件

在这里插入图片描述

	<Wizard
       id="CreateProductWizard"
       complete="wizardCompletedHandler"
    >
wizardCompletedHandler:function(){
                this._oNavContainer.to(this.byId("wizardReviewPage"));
            },

1.2.2 Wizard:finishButtonText

  • 更改最后一个步骤的按钮文本。默认是Preview

在这里插入图片描述

1.2.3 Wizard:currentStep

  • 指定初始化时显示的步骤

在这里插入图片描述

1.2.4 Wizard:backgroundDesign

  • 共有4种属性Standard,Solid,List,Transparent。 具体效果差异不大

1.2.5 Wizard:enableBranching

  • 可以分配Step中的分支,并指定需要的Step作为下一步
  • 要配合WizardStep中的subsequentSteps,nextStep使用.
  • 必须初始化时指定subsequentSteps对应组建的nextStep (onAfterRendering)
  • View
   <Button text="更换为A-C-B" press="ChangeStep"></Button>
   <Wizard id="customStep" enableBranching="true" backgroundDesign="Solid">
        <WizardStep id="A" title="A" subsequentSteps="B,C"></WizardStep>
        <WizardStep id="B" title="B" nextStep="D"></WizardStep>
        <WizardStep id="C" title="C" nextStep="D"></WizardStep>
        <WizardStep id="D" title="D" ></WizardStep>
    </Wizard>
  • Controller
	onAfterRendering: function () {
	    var stepA = this.byId("A")
	    var stepB = this.byId("B")
	    stepA.setNextStep(stepB)    
	},
	ChangeStep:function(){
	    
	    var wizard2 = this.byId("customStep")
	    wizard2.discardProgress(wizard2.getSteps()[0]);
	    var stepA = this.byId("A")
	    var stepC = this.byId("C")
	
	    stepA.setNextStep(stepC)    
	    
	    
	},

1.2.6 WizardStep:validated

  • 判断当前页面有无错误。如果没有错误则显示下一步按钮,否则不显示下一步按钮
  • 再控制器中使用validateStep,invalidateStep控制属性
  • 结合activate属性一起使用,activate事件绑定控制validated属性的逻辑

在这里插入图片描述

	<WizardStep
	     id="ProductInfoStep"
	     validated="false"
	     title="基本信息"
	     activate="additionalInfoValidation"
	 >
	additionalInfoValidation: function () {
       var name = this.byId("ProductName").getValue();
       var unit = this.byId("ProductUnit").getValue();

       if (unit != "EA") {
           this._wizard.setCurrentStep(this.byId("ProductInfoStep"));
           this.model.setProperty("/productUnitState", "Error");
       } else {
           this.model.setProperty("/productUnitState", "None");
       }

       if (name.length < 6) {
           this._wizard.setCurrentStep(this.byId("ProductInfoStep"));
           this.model.setProperty("/productNameState", "Error");
       } else {
           this.model.setProperty("/productNameState", "None");
       }

       if (name.length < 6 || unit != "EA") {
           this._wizard.invalidateStep(this.byId("ProductInfoStep"));
       } else {
           this._wizard.validateStep(this.byId("ProductInfoStep"));
       }
   },

1.2.7 WizardStep:complete

  • 当点击下一步按钮之后触发事件
  • View
	<WizardStep
	   id="PricingStep"
	    complete="inputComplete"
	    validated="true"
	    title="最后确认"
	>
  • Controller
	inputComplete: function () {
	    this.model.setProperty("/complete", true)
	    debugger
	},

1.3 跳转函数

1.3.1 goToStep

  • pageno是需要跳转的Step
this._wizard.goToStep(this._wizard.getSteps()[pageno]);

在这里插入图片描述

1.3.2 discardProgress

  • 撤回所有Step并跳转
this._wizard.discardProgress(this._wizard.getSteps()[pageno]);

在这里插入图片描述

2. NavContainer

2.1 基本组成

  • 默认会显示第一个Page,之后会通过事件进行Page之间的跳转
<NavContainer>
	<pages>
		<Page></Page>
		<Page></Page>
	</pages>
</NavContainer>

2.2 Page跳转

  • 跳转到指定Page
	this._oNavContainer = this.byId("wizardNavContainer");
	this._oNavContainer.to(this.byId("wizardReviewPage"));
  • 跳转到之前Page
	this._oWizardContentPage = this.byId("wizardContentPage");
	this._oNavContainer.backToPage(this._oWizardContentPage.getId());
  • 绑定跳转事件
	var fnAfterNavigate = function () {
	    this._wizard.goToStep(this._wizard.getSteps()[pageno]);
	    this._oNavContainer.detachAfterNavigate(fnAfterNavigate);
	}.bind(this);
	
	this._oNavContainer.attachAfterNavigate(fnAfterNavigate);

3. 示例代码

  • View
<mvc:View
    controllerName="c080.controller.Main"
    xmlns:form="sap.ui.layout.form"
    xmlns:mvc="sap.ui.core.mvc"
    xmlns:core="sap.ui.core"
    displayBlock="true"
    xmlns="sap.m"
>
    <NavContainer id="wizardNavContainer">
        <pages>
            <Page
                id="wizardContentPage"
                title="{i18n>title}"
            >
                <Wizard
                    id="CreateProductWizard"
                    complete="wizardCompletedHandler"
                    finishButtonText="最后确认"
                    currentStep="LastStep"
                >
                    <WizardStep
                        id="ProductTypeStep"
                        title="物料类型"
                        validated="true"
                    >
                        <MessageStrip
                            class="sapUiSmallMarginBottom"
                            text="请选择物料类型,并点击下一步"
                            showIcon="true"
                            type="Information"
                        />

                        <HBox
                            alignItems="Center"
                            justifyContent="Center"
                            width="100%"
                        >
                            <SegmentedButton
                                width="320px"
                                selectionChange="setProductTypeFromSegmented"
                            >
                                <items>
                                    <SegmentedButtonItem
                                        icon="sap-icon://database"
                                        text="成品"
                                    />
                                    <SegmentedButtonItem
                                        icon="sap-icon://technical-object"
                                        text="原料"
                                    />
                                    <SegmentedButtonItem
                                        icon="sap-icon://tags"
                                        text="其他"
                                    />
                                </items>
                            </SegmentedButton>
                        </HBox>
                    </WizardStep>
                    <WizardStep
                        id="ProductInfoStep"
                        validated="false"
                        title="基本信息"
                        activate="additionalInfoValidation"
                    >
                        <MessageStrip
                            class="sapUiSmallMarginBottom"
                            text="通过validated属性控制下一步按钮的显示。具体调用validateStep(Step) / invalidateStep(Step)  "
                            showIcon="true"
                        />

                        <form:SimpleForm
                            editable="true"
                            layout="ResponsiveGridLayout"
                        >
                            <Label
                                text="物料描述"
                                required="true"
                            />
                            <Input
                                valueStateText="请输入6位以上的文字"
                                valueState="{/productNameState}"
                                id="ProductName"
                                liveChange="additionalInfoValidation"
                                placeholder="请输入6位以上的文字"
                                value="{/productName}"
                            />
                            <Label
                                text="基本单位"
                                required="true"
                            />
                            <Input
                                valueStateText="基本单位只能输入EA"
                                valueState="{/productUnitState}"
                                id="ProductUnit"
                                liveChange="additionalInfoValidation"
                                type="Text"
                                placeholder="请输入单位"
                                value="{/productUnit}"
                            />
                            <Label text="物料组" />
                            <Select selectedKey="{/productGroup}">
                                <core:Item
                                    key="10"
                                    text="笔记本"
                                />
                                <core:Item
                                    key="20"
                                    text="台式机"
                                />
                                <core:Item
                                    key="30"
                                    text="一体机"
                                />
                            </Select>
                            <Label text="备注" />
                            <TextArea
                                value="{/productDescription}"
                                rows="5"
                            />
                        </form:SimpleForm>
                    </WizardStep>
                    <WizardStep
                        id="OptionalInfoStep"
                        title="额外信息"
                    >
                        <MessageStrip
                            class="sapUiSmallMarginBottom"
                            text="请输入额外信息"
                            showIcon="true"
                        />
                        <VBox>
                            <form:SimpleForm
                                editable="true"
                                layout="ResponsiveGridLayout"
                            >
                                <Label text="采购类型" />
                                <CheckBox
                                    id="inStock"
                                    text="内部生产"
                                    valueState="Information"
                                    selected="{/inStock}"
                                    select="onCheckBoxSelect"
                                />
                                <CheckBox
                                    id="outStock"
                                    text="外部采购"
                                    valueState="Information"
                                    selected="{/outStock}"
                                    select="onCheckBoxSelect"
                                />
                                <Label text="其他信息" />
                                <TextArea
                                    value="{/optionalDescription}"
                                    rows="5"
                                />
                            </form:SimpleForm>
                        </VBox>
                        <!-- <HBox justifyContent="Start">
                        <Button text="Save" type="Emphasized" width="100px"></Button>
                    </HBox> -->
                    </WizardStep>
                    <WizardStep
                        id="LastStep"
                        complete="inputComplete"
                        validated="true"
                        title="最后确认"
                    >
                        <MessageStrip
                            class="sapUiSmallMarginBottom"
                            text="使用previousStep() 和 nextStep() 方法跳转wizard步骤. 另外 GoToStep(step) 方法可以跳转指定步骤"
                            showIcon="true"
                        />
                    </WizardStep>
                </Wizard>
                <Button text="更换为A-C-B" press="ChangeStep"></Button>
                <Wizard id="customStep" enableBranching="true" backgroundDesign="Solid">
                    <WizardStep id="A" title="A" subsequentSteps="B,C"></WizardStep>
                    <WizardStep id="B" title="B" nextStep="D"></WizardStep>
                    <WizardStep id="C" title="C" nextStep="D"></WizardStep>
                    <WizardStep id="D" title="D" ></WizardStep>
                </Wizard>

                <footer>
                    <Bar>
                        <contentRight>
                            <Button
                                text="Cancel"
                                press="handleWizardCancel"
                            />
                        </contentRight>
                    </Bar>
                </footer>
            </Page>
            <Page
                id="wizardReviewPage"
                showHeader="false"
            >
                <form:SimpleForm
                    title="1. 物料类型"
                    editable="false"
                    layout="ResponsiveGridLayout"
                >
                    <Label text="物料类型" />
                    <HBox renderType="Bare">
                        <core:Icon
                            src="{/productTypeIcon}"
                            class="sapUiSmallMarginEnd"
                        />
                        <Text
                            id="ProductTypeChosen"
                            text="{/productType}"
                        />
                    </HBox>
                    <Link
                        press="editStep1"
                        text="Edit"
                    />
                </form:SimpleForm>
                <form:SimpleForm
                    title="2. 基本信息"
                    editable="false"
                    layout="ResponsiveGridLayout"
                >
                    <Label text="物料描述" />
                    <Text text="{/productName}" />
                    <Label text="基本单位" />
                    <Text text="{/productUnit}" />
                    <Label text="物料组" />
                    <Text text="{/productGroup}" />
                    <Label text="备注" />
                    <Text text="{/productDescription}" />
                    <Link
                        press="editStep2"
                        text="Edit"
                    />
                </form:SimpleForm>
                <form:SimpleForm
                    title="3. 额外信息"
                    editable="false"
                    layout="ResponsiveGridLayout"
                >
                    <Label text="采购类型" />
                    <Text
                        text="{= ${/inStock} ? ${/outStock} ? '内部生产,外部采购' : '内部生产' : ${/outStock} ? '外部采购' : '无'}"
                    />
                    <Label text="其他信息" />
                    <Text text="{/optionalDescription}" />
                    <Link
                        press="editStep3"
                        text="Edit"
                    />
                </form:SimpleForm>
                <footer>
                    <Bar>
                        <contentRight>
                            <Button
                                text="提交"
                                press="handleWizardOk"
                            />
                            <Button
                                text="取消"
                                press="handleWizardCancel"
                            />
                        </contentRight>
                    </Bar>
                </footer>
            </Page>
        </pages>
    </NavContainer>
    
    
</mvc:View>

  • Controller
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    'sap/ui/model/json/JSONModel'
],
    /**
     * @param {typeof sap.ui.core.mvc.Controller} Controller
     */
    function (Controller, JSONModel) {
        "use strict";

        return Controller.extend("c080.controller.Main", {
            onInit: function () {
                this._wizard = this.byId("CreateProductWizard");
                this._oNavContainer = this.byId("wizardNavContainer");
                this._oWizardContentPage = this.byId("wizardContentPage");

                this.model = new JSONModel();
                this.model.setData({
                    productNameState: "Error",
                    productUnitState: "Error",
                    productName: "测试用物料010",
                    productUnit: "EA",
                    productGroup: "20",
                    productDescription: "SAP(Systems, Applications, and Products)是一套全球领先的企业管理软件解决方案,帮助企业整合各业务流程,提高效率。其包括ERP(企业资源规划)、CRM(客户关系管理)、SCM(供应链管理)等模块,涵盖财务、人力资源、生产等方面。SAP通过实时数据处理和集成,优化企业运营,提供智能决策支持。其灵活性和可扩展性使其适用于各行各业,成为全球众多企业的首选解决方案,助力业务创新和数字化转型。",
                    optionalDescription: "UI5是SAP开发的用户界面框架,基于HTML5技术,用于构建现代、响应式、直观的企业级Web应用程序。它支持模块化、扩展性强,提供丰富的控件库,简化开发流程,实现优秀的用户体验。",
                    productType: "成品",
                    productTypeIcon: "sap-icon://database",
                    inStock: false,
                    outStock: false,
                    complete: false
                });
                this.getView().setModel(this.model);

                
            },
            onAfterRendering: function () {
                var stepA = this.byId("A")
                var stepB = this.byId("B")
                stepA.setNextStep(stepB)    
            },
            ChangeStep:function(){
                
                var wizard2 = this.byId("customStep")
                wizard2.discardProgress(wizard2.getSteps()[0]);
                var stepA = this.byId("A")
                var stepC = this.byId("C")

                stepA.setNextStep(stepC)    
                
                
            },
            additionalInfoValidation: function () {
                var name = this.byId("ProductName").getValue();
                var unit = this.byId("ProductUnit").getValue();

                if (unit != "EA") {
                    this._wizard.setCurrentStep(this.byId("ProductInfoStep"));
                    this.model.setProperty("/productUnitState", "Error");
                } else {
                    this.model.setProperty("/productUnitState", "None");
                }

                if (name.length < 6) {
                    this._wizard.setCurrentStep(this.byId("ProductInfoStep"));
                    this.model.setProperty("/productNameState", "Error");
                } else {
                    this.model.setProperty("/productNameState", "None");
                }

                if (name.length < 6 || unit != "EA") {
                    this._wizard.invalidateStep(this.byId("ProductInfoStep"));
                } else {
                    this._wizard.validateStep(this.byId("ProductInfoStep"));
                }
            },
            setProductTypeFromSegmented: function (evt) {

                var productType = evt.getParameters().item.getText();
                var productTypeIcon = evt.getParameters().item.getIcon();

                this.model.setProperty("/productType", productType);
                this.model.setProperty("/productTypeIcon", productTypeIcon);

            },
            onCheckBoxSelect: function (evt) {
                // debugger
                var oText = evt.getSource().getProperty('text');
                var isSelected = evt.getParameters().selected;
                if (oText === "内部制作") {
                    this.model.setProperty("/inStock", isSelected);
                } else if (oText === "外部采购") {
                    this.model.setProperty("/outStock", isSelected);
                }


            },
            wizardCompletedHandler: function () {
                this._oNavContainer.to(this.byId("wizardReviewPage"));
            },
            inputComplete: function () {
                this.model.setProperty("/complete", true)
               
            },
            goToPage: function (pageno) {
                var fnAfterNavigate = function () {
                    this._wizard.goToStep(this._wizard.getSteps()[pageno]);
                    this._oNavContainer.detachAfterNavigate(fnAfterNavigate);
                }.bind(this);

                this._oNavContainer.attachAfterNavigate(fnAfterNavigate);
                this._oNavContainer.backToPage(this._oWizardContentPage.getId());
            },
            editStep1: function () {
                this.goToPage(0)
            },
            editStep2: function () {
                this.goToPage(1)
            },
            editStep3: function () {
                this.goToPage(2)
            },
            handleWizardCancel: function () {
                // alert(11)
                this._oNavContainer.backToPage(this._oWizardContentPage.getId());
                this._wizard.discardProgress(this._wizard.getSteps()[0]);
            }

        });
    });

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/379548.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

[红日靶机渗透] ATKCK红队评估实战靶场三

&#x1f36c; 博主介绍&#x1f468;‍&#x1f393; 博主介绍&#xff1a;大家好&#xff0c;我是 hacker-routing &#xff0c;很高兴认识大家~ ✨主攻领域&#xff1a;【渗透领域】【应急响应】 【ATK&CK红队评估实战靶场】 【VulnHub靶场复现】【面试分析】 &#x1f…

Ubuntu22.04 gnome-builder gnome C 应用程序习练笔记(一)

一、序言 gnome-builder构建器是gnome程序开发的集成环境&#xff0c;支持主力语言C, C, Vala, jscript, python等&#xff0c;界面以最新的 gtk 4.12 为主力&#xff0c;将其下版本的gtk直接压入了depreciated&#xff0c;但gtk4.12与普遍使用的gtk3有很大区别&#xff0c;原…

【C++】引用与内联

个人主页 &#xff1a; zxctsclrjjjcph 文章封面来自&#xff1a;艺术家–贤海林 如有转载请先通知 文章目录 1. 前言2. 引用2.1 引用概念2.2 引用使用场景2.3 引用特性2.4 引用和指针的区别2.5 传值、传引用效率比较2.5.1 值和引用的作为返回值类型的性能比较 3. 内联函数3.1 …

Vue事件中如何使用 event 对象

在Vue中&#xff0c;事件处理函数常常需要获取事件触发时的相关信息&#xff0c;比如鼠标位置、按键信息等。而要获取这些信息&#xff0c;就需要使用event对象。那么在Vue的事件中如何正确使用event对象呢&#xff1f;接下来就来详细介绍一下。 首先&#xff0c;在Vue的事件中…

JUC-并发面试题

一、基础 1、为什么要并发编程 充分利用多核CPU的资源2、并发编程存在的问题 上下文切换:PU通过时间片分配算法来循环执行任务,当前任务执行一个时间片后会切换到下一个任务。在切换前会保存上一个任务的状态,以便下次切换回这个任务时,可以再加载这个任务的状态。任务从保…

国考试题答案?五个不限次的公众号和软件分享啦! #学习方法#学习方法

在如今的智能化时代&#xff0c;我们的生活离不开手机&#xff0c;有许多工具能让生活更加方便&#xff0c;那么今天小招就介绍几款&#xff0c;在大学生活中常用的软件&#xff0c;给即将到来的小萌新们 1.灵兔搜题 这个是公众号 题库内容丰富全面&#xff0c;细致分类整理…

PySpark(三)RDD持久化、共享变量、Spark内核制度,Spark Shuffle、Spark执行流程

目录 RDD持久化 RDD 的数据是过程数据 RDD 缓存 RDD CheckPoint 共享变量 广播变量 累加器 Spark 内核调度 DAG DAG 的宽窄依赖和阶段划分 内存迭代计算 Spark是怎么做内存计算的? DAG的作用?Stage阶段划分的作用? Spark为什么比MapReduce快&#xff1f; Spa…

Qt网络编程-TCP与UDP

网络基础 TCP与UDP基础 关于TCP与UDP的基础这里就不过多介绍了&#xff0c;具体可以查看对应百度百科介绍&#xff1a; TCP&#xff08;传输控制协议&#xff09;_百度百科 (baidu.com) UDP_百度百科 (baidu.com) 需要知道这两者的区别&#xff1a; 可靠性&#xff1a; TC…

报道|2024 INFORMS Franz Edelman奖决赛名单

编者按 近日&#xff0c;2024年INFORMS Franz Edelman奖公布了决赛名单。Franz Edelman奖旨在促进能拯救生命、节省金钱以及解决问题的研究。决赛名单包含了零售、航空、食物供应链以及可持续发展等领域的优秀研究。 NFORMS近日发文&#xff0c;公布了进入2024 INFORMS Franz E…

如何在 emacs 上开始使用 Tree-Sitter (archlinux)

文章目录 如何在emacs上开始使用Tree-Sitter&#xff08;archlinux&#xff09; 如何在emacs上开始使用Tree-Sitter&#xff08;archlinux&#xff09; 在archlinux上使用比windows上不知道要方便多少倍&#xff01; $ sudo pacman -S emacs $ sudo pacman -S tree-sitter这里…

了解物联网漏洞与家庭网络入侵之间的联系

我们的家庭正日益成为一个由互连设备组成的网络。从智能恒温器到联网冰箱&#xff0c;物联网 (IoT) 彻底改变了我们与家庭环境互动的方式。 随着技术进步带来了新的挑战&#xff1a;这些设备容易受到网络威胁以及随之而来的家庭网络入侵风险。 在这篇博文中&#xff0c;我们将…

Quartus工程的qsf配置约束文件介绍

一、qsf文件概述 qsf&#xff1a;Quartus Setting File&#xff0c;是Quartus工程的配置文件&#xff1b; 包含一个Quartus工程的所有约束&#xff0c;包括工程的软件版本信息、FPGA器件信息、引脚约分配、引脚电平分配&#xff0c;编译约束和用于Classic TimingAnalyzer的时…

Mac电脑如何通过终端隐藏应用程序?

在我们使用Mac电脑的时候难免会遇到想要不想看到某个应用程序又不想卸载它们。值得庆幸的是&#xff0c;macOS具有一些强大的文件管理功能&#xff0c;允许用户轻松隐藏&#xff08;以及稍后显示&#xff09;文件甚至应用程序。 那么&#xff0c;Mac电脑如何通过终端隐藏应用程…

《动手学深度学习(PyTorch版)》笔记7.6

注&#xff1a;书中对代码的讲解并不详细&#xff0c;本文对很多细节做了详细注释。另外&#xff0c;书上的源代码是在Jupyter Notebook上运行的&#xff0c;较为分散&#xff0c;本文将代码集中起来&#xff0c;并加以完善&#xff0c;全部用vscode在python 3.9.18下测试通过&…

XGB-6: 单调性约束Monotonic Constraints

在建模问题或项目中&#xff0c;通常情况下&#xff0c;可接受模型的函数形式会以某种方式受到约束。这可能是由于业务考虑&#xff0c;或者由于正在研究的科学问题的类型。在某些情况下&#xff0c;如果对真实关系有非常强烈的先验信念&#xff0c;可以使用约束来提高模型的预…

Redis -- 安装客户端redis-plus-plus

目录 访问reids客户端github链接 安装git 如何安装&#xff1f; 下载/编译、安装客户端 安装过程中可能遇到的问题 访问reids客户端github链接 GitHub - sewenew/redis-plus-plus: Redis client written in CRedis client written in C. Contribute to sewenew/redis-p…

Javaweb之SpringBootWeb案例之异常处理功能的详细解析

3. 异常处理 3.1 当前问题 登录功能和登录校验功能我们都实现了&#xff0c;下面我们学习下今天最后一块技术点&#xff1a;异常处理。首先我们先来看一下系统出现异常之后会发生什么现象&#xff0c;再来介绍异常处理的方案。 我们打开浏览器&#xff0c;访问系统中的新增部…

运维的利器--监控--zabbix--第一步:建设zabbix

文章目录 准备工作安装要求安装包获取安装环境 安装工作一、zabbix server服务端安装1.安装mysql2.安装zabbix server及配置环境3.设置并访问zabbix页面5.配置自我监控二、被监控端zabbix agent安装三、在服务端中添加被监控端 思维导图 准备工作 安装要求 为啥要确保正常上网…

自学Python第二十二天- Django框架(六) django的实用插件:cron、APScheduler

django-crontab 和 django-cron 有时候需要django在后台不断的执行一个任务&#xff0c;简单的可以通过中间件来实现&#xff0c;但是中间件是根据请求触发的。如果需要定时执行任务&#xff0c;则需要使用到一些插件。 django-crontab 和 django-cron 是常用的用于处理定时任…

three.js 匀速动画(向量表示速度)

效果&#xff1a; 代码&#xff1a; <template><div><el-container><el-main><div class"box-card-left"><div id"threejs" style"border: 1px solid red"></div>1. 匀速动画(向量表示速度)</div…