00:00
好，大家看哈，这个里面呢，有一个步骤条是不是，然后我点下一步，下一步下一步好，这就是步骤条，这个东西很好用啊，我们呢，先在我们的这个啊页面当中啊，我先创建一个包点哈，我先给它创建一个啊，就咱们先初始化一个自己的。右键，然后新建文件，然后呢，包包点这里有一个哈，我刚才拷过来的这个叫借款人信息认证对吧，那实际上就是大家也可以从这个地方拷贝过来。嗯，资料第四部分pages user就是它哈，刚才我们一起移植过来的嘛，啊就是这个东西，然后接下来呢，我们来看一下这个拿过来之后呢，里面啥也没有哈，就一个script，然后就一个借款人信息认证嘛，然后呢，我们直接呢在这个地方访问一下。
01:00
叫包。好，就这样的一个页面，然后在这个页面当中呢，我们先去嵌入这个步骤条，我们看一看怎么去嵌。啊，在。在这个刚才这个element UI这个组件当中，我们把它打开。啊，打开之后呢，我们来看一下。这里面是不是有个e steps呀，表示的就是上面这个条嘛，啊，然后接下来呢，是不是有个下一步按钮啊，表示的就是这个按钮啊啊，然后我们就先给它拷过来。拷过来啊，考到哪啊，考到考到这来好，然后接下来这个下一步按钮是不是绑了一个方法叫，那好我们也先给它考过来。方法。好，然后接下来呢，这个next方法，它操作了谁active，所以你肯定需要一个active，我们把它拷过来。
02:11
好都拷过来了是吧，这样的话呢，其实我们就相当于呢，参考着它官方的文档做了这么一个步骤导航，那我们来看一下这个步骤导航它能不能工作哈。嗯，下一步下一步下一步是不是工作起来了啊好，那它是如何工作的呢？我们来看一下，主要呢，就是由这个安决定的。啊，每一次我们点击这个next按钮的时候呢，这个active呢，都做了一个加加操作，所以当active加一的时候，它就自动的跑到下一步了，这是它自动的一个功能啊，并且呢，已经完成的步骤呢，它会显示成一个绿色的勾，就叫success，那这是它设置的一个属性，已经完成的步骤，这就是这样，然后步骤一，步骤二，步骤三这三个文本呢，分别在这个地方进行定义就行了，所以呢，你如果想定义成别的名字的话，那就只需要修改这块。
03:02
明白哈，好，然后呢。这块其实就是我们的步骤导航了啊，那所以如果你比如说想有三个步骤，那你就可以在这个地方呢，比如说第一步，这是第一步的内容，然后呢，我就V-if，如果XK等于零的话，你看它最开始的时候active是等于零的是吧？啊如果X0的话，我就展示第一步。那所以你看现在active等于零，展示的是第一步，然后下一步就没有第一步了，那所以呢，这个是第一步的第一，第一部的内容好，然后接下来呢，我们还可以写第二部的内容和第三部的内第二部的内容。和第三步的内容，然后呢，这是X等于一，这是X等于二，好然后所以呢，当我们点击这个下一步的时候，现在是第一步，这是第一步的内容，点击第二步好就切换到第二步的表单内容了，点击第三步就切换成第三步的表单内容了，那我们要做的是不是就完善这个表单就可以了啊，就是这样的一个意思啊，所以咱们把这个步骤导航搞明白了的话呢，后面的内容呢，就比较好理解了，那所以大家来看一看。
04:22
我呢先还是把这个删掉啊，刚才咱们是对这个步骤导航的简单的讲解，然后现在呢，咱们把咱们表单的内容呢，直接整合进来。
我来说两句