day09/上午/174-尚硅谷-尚融宝-前端调用接口进行数据绑定

那现在呢，我们来整合前端，前端这一块呢，我们先创建一个API，就是在car下面创建一个Di的点JS，我们来打开我们的前端的代码，然后呢，找到我们的s rb me，然后呢，在API这个里面靠下面我们右键创建一个文件叫Di的点JS，好，然后呢，在这个里面呢，我们就是和以前一样创建我们的API接口的调用，那这个调用的具体的过程呢，咱们就不详细的去说了，因为没有任何新的知识点啊好，我就直接把它放这个复制过来了，第一个步骤呢，就是导入啊request，第二个步骤呢，就是嗯，导出对吧，默认模块，第三个步骤呢，就是定义parent ID，然后呢，我们来写一个接口啊的这个参数，然后接下来呢，把这个request给它做一个调用，然刚才呢，我们写的这个接口的URL地址呢。

给它定义在这个位置，那我们的方式呢，是get方式，好这块呢，就是完整的一个API，未来像这个地方API的定义，如果没有什么特殊，我就不进行说明了，咱们就直接拷贝了啊，就不浪费时间去敲了，好，这是API前端，然后接下来呢，我们来在页面当中去绑定它，那在哪个页面当中绑定呢？就是在数据字典啊，Take list这个页面当中呢进行绑定，所以呢，我们找到我们的数据字典所在的页面，那么views car take list，好，然后呢，在这里面呢，因为咱们要展示数据嘛，所以呢，在这个地方呢，咱们定一个列表，好这块呢，就是我们的数据字典列表，对吧？好，然后接下来呢，我们在这块呢，定一个生命周期函数，就是页面一加载的时候呢，我们就希望这个列表呢，展示出来啊好，然后这边呢，我们就写一个类似点啊。

是data好，那我们现在呢，就来定一下这个白data好，然后这块呢，我们就写这个date API，所以呢，我们在在上面呢，把这个API给引进来，IC API from at杠啊，然后API-Co-de好，然后接下来呢，De API。这个位置我们的点。List类啥呢？刚才写的这个by parent ID，然后接下来呢，我们把这个parent ID放进去，Parent ID呢，第一，呃，首先我们肯定是要列出来的是顶层类别了，顶层类别的话，它有一个固定的ID，就是一啊，在我们的数据库当中导去的时候，对吧？它它就是一啊，这是顶层类的ID，所以这边硬编码就可以了，然后呢，拿到这个啊一这个顶层类别之后呢，我们呢，就可以渲染进行数据绑定了，Response，好，然后this.list等于response.data.list对不对？好，那我们来看一下这个数据有没有啊进行成功的绑定，所以呢，我们F12看一下这个view啊。

看一下APP lay out APP们累。嗯，我看一下啊，应该去去点这个数据字典是吧。然后点这块，然后是list，然后这块有个list看见了吧，这样的话呢，这个我们从后台取出的所有的一级类别呢，就绑定到我们的类似的这个呃，数据模型当中了，那么绑定完了之后呢，我们要做的呢，就是数据渲染。