openlayers引入方式

好，那么接着往下面再去实行一个小的功能，我们现在需要在地图上写设置一个按钮，那么点击这个按钮会执行一个复位的飞行效果。 好，首先我们给他去设置一个按钮，好吧？设置一个叫复位地图，好吧？叫复位地图， 给它 class， 然后加 b t n， 我们接着给这个按钮设置一些样式，点 b t n， 给它一个 project fix， 那么接着给它一个 zing 的尾翼摆， 然后我们给它一个 top 字为三四相数， right 字 为多少呢？为五十像素。好，我们去页面上看一下。好，那么目前这个按钮好像找不到，我们使用调试工具，我们来看一下，看按钮到底现在在什么地方，好吧， 好，按钮在下面，对吧？在下面， 那么我们看一下这个按钮，我没有给他设置什么，设置这个 btn 这 class， 好，我们设置一下 class， 然后我们再来刷新，那么按钮就放到这一块了，那我们现在的需求是点击按钮，那么地图会自行一个复位的功能，好吧， 那么来获取一下按钮，好吧，获取按钮，那么声明这个 b t n 等于什么？ document 点 query select， query select， 好吧，我们获取一下这个 beating， 好，我们来打印一下这个 beating， ctrl 点 log 一下 beating， 我们看获取的是一个什么东西。 好，刷新一下，那么这一块我们是能够获取什么？能够获取这个 b t n 的，那么接着我们就可以给这个 b t n 实行一个点击四键了， 那么 d t n 给它绑定一个 click 四键，那我们执行一个规调，对吧？我们现在需要当试图 复位，那么直接执行个 map 点歌的 video 方法，我们可以获取视图，那么获取视图之后，我们执行一个 animate 方法，我们 on 它去复位，那么中心点它是在幺幺四 四点三零，三零点五零这个地方，那么接着我们给他一个放大级别，那么注目，我们给他一个六的放大级别，是吧？好，那我们来测试一下。 好，点击地图，那么大家可以看到，那么这一块它就会实行一个复位的效果，对不对？但是这个速度太快了，我们其实可以把这个速度去给它去调一下，那么它有一个 gear rating duration， 然后呢给它时间设置长一点，设置为三秒，好，我们现在去页面上再来看一下，好刷新，那么复位，对吧？它会自行一个缓慢的复位的效。 好，那我们接着再来测试一下啊，再来测试一下，我们点击这个复位，那么他会会有个缓慢的加载的效果，那么这一块是因为这个地图还没加载出来，对吧？这个瓦片瓦片图层还没加载出来，那么这个 点击到对应的地方，对应的地方会执行一个，这个会加一个点，对不对？然后呢他会执行一个漫游，我们实现了，对吧？那么呢点击复位，我们也实现了这个复位地图， 好，那我们的整体的需求我们就实现了，那么这就是我们这一讲的几个内容，我们简单的总结一下。那么第一个我们执行了给地图绑定的一个点击实验，那么通过这个点击实践，我们能够获取坐标，那么第二个我们是在我们点击 地方能够去添加一个点要素，那么第三个我们是执行的一个漫游，那么这就是我们这一讲的内容，那么到此结束。

那里面这里面传餐是有点多的，我们来解释一下这个参数，那么第一个参数是什么？横坐标方向，第二个参数是中左标方向第一个参，第一个参数和第二个参数是绘制的中心点，那么第三个参数是什么呢？是半径， 就是绘制的半径。第四个参数是什么？开始的弧度， 那么第五个参数是什么呢？是结束的弧度。 好，那么圆形我们就已经绘制成功了，那么其实我们还可以给什么？给这个圆形一个填充色， 那么 setters 我们执行一个什么叫 feel style 方法，我们给它一个填充色， 好吧，那么填充的颜色为三三，那么之后设置完填充这个之后，我们还需要执行一个什么叫 feel 方法，那么我们需要给填充下这个什么？这个矩形。 好，大家可以看到哦，填充一下这个圆形，大家可以看到，那么目前这个圆就被我们填充好了，当然这个地方如果是我们需要给描边一个颜色也是可以的，那么 set 也要给它样式，对吧？ setters stroke， 我们给这个对象，是吧？一个 stroke style 方法对不对啊？给他一个 f f 二 d 五幺。 好，那我们来刷新，大家可以看到，那么这一块他会也会有一个什么？有一个描边色，对吧？当然我们也可以给他设置一下这个描边的宽度也是可以的。好，那么 我们回到代码里面来，我们来设置一下这个描边的宽度，好吧，那我们执行一个 c tax， 执行一个 nine wide， 那么给它一个十。 好，那么回到代码里面呢？我们来看一下刷新，大家可以看到，那我们就设置了一下描边的宽度，那这是我们使用 converse 来绘制一个圆，那如果是我们需要使用 converse 来绘制多个圆，可不可以实现呢？那么也是可以去做实现的， 那现在好，那么我们现在说一下我的需求，好吧？我的需求好，那么现在有一个画布，对吧？我需要从这个画布的中心点，对吧？那么首先我绘制一个， 那么首先从这个中心点绘制一个五十乘五五十像素的一个圆，那么再到这个中心点绘制一个什么 一百乘一百像素的圆，那么我需要在这个中心点绘制两个圆，好吧，绘制两个圆，那么怎么去做？绘制？那么十二我们需要使用 compass 来做什么呢？绘制多个圆，对不对？ 那么首先我们实现一个 htm 元素，那么设置一个 converse， 给他一个 id 为多少呢？为 conference， 那么接着我们去给他一个对应的宽度， 宽度为四百像素，那么高度为多少呢？高度也为四百像素。好，那么说一下需求，那么需要从中心点绘制一个半径为一百像素的圆，那么再绘制一个半径为五十像素的圆，对吧？我们一个一个来自行绘制， 那么首先我们需要获取这个对应的 converse 元素，对吧？我们获取要 converse， 对于 document 点 get element 摆 id， 我们需要获取什么呢？获取这个 converse 元素，那么接着我们需要获取一下上下文，对吧？ 那么通过 conference， 它下面有个 get context 方法，我们可以获取这个绘制对象，对吧？绘制获取绘制对象，那么呢我们首先来绘制第一个圆，对吧？第一个圆，那么 setux 执行一个 begin pass 方法，然后呢我们再用 satas 执行一个 arc 方法，那么首先是中心点，那么中心点是两百，对吧？ 两百，那么接着是绘制的半径，绘制的半径是一百，对吧？那么接着是绘制的弧度，从零到什么？ 到二派，对吧？到二派，那么 setters 执行一个 close pass 方法， 好，那我们给他一个填充色，好吧，那么 set us 点 feel style， 给他一个 f f 二 d 五幺， 那么我们再来执行一个 satis 执行 feel 方法，我们给这个绘的对象一个填充， 我们来看一下，那么这个圆弧，这个，这个，呃，这个圆已经直线的一个绘制了， 好，那么这个 fill style 啊， fill style 写错了，所以它还是一个黑色，我们回到我们的代码里面来，我们刷新，那么现在就是个红色，那么第一个点我们就要进行绘制了，那么我们接着来绘制什么呢？第二个圆， 那么也是 setters 执行一个 begin pass， 对吧？设置这个 case 路径，对吧？那么 setters 执行一个 arc， 那么首先我们给它设置这个中心点，那么接着我们给它设置半径，那么设置起点的起始的这个弧度，设置这个终点的弧度， 那么设置成功之后，那么执行一个 status， 执行一个 closed close pass 方法， 然后呢执行一个 say ctux 点飞哦 style 方法，设置一下它的颜色，颜色，我们随便给他一个颜色，就给个三十三啊，不，三十三给个黑色，那么呢我们执行一个 feel 方法，那么呢实现绘制 好，回到我们的页面，我们现在刷新，大家可以看到，那么第二个圆也出来了，那么这就是我们使用什么呢？使用 conference 来实现圆的绘制。

现在我们就来安装这个 open double t 的软路由系统啊。 第一步呢我们是需要制作一个 vp 的 u 盘，如果你有的话就不需要制作了，如果你没有的话呢，我们首先呢准备一个 u 盘，这个 u 盘呢？呃， 大点小点无所谓，都可以用。首先我们去下载一个 vpe 工具箱，你可以去他的官网也可以在我的这个呃网盘里面下载啊，下载完之后呢，我们直接双击打开，之后呢就是这个样子。然后呢我们把我们的 u 盘呢插在这个电脑上面， 这边提醒大家一下，你 u 盘里面所有的东西呢备份一下，因为做的时候呢就会格式化，那一般情况我是只要买了新 u 盘，我就首先第一步就是给他安装一个这个 vpe， 那平常我们也可以当他一个普通 u 盘， 对吧？那如果出现了问题，系统出现了问题，或者要装机啊，我们就可以是一个 vp u 盘，插到电脑上就可以用啊。这个之后呢我们选择这个 u 盘安装到 u 盘这个选项，但这个里边的基本上都不需要管，那这个地方我们需要改一下，改成 ntfs， 因为 nn tfs 它是最大可以支持四 g 以上的文件，如果你选其他的这个格式，四 g 以上的文件你都考不到 u 盘里面了。好，那现在呢我们直接点击这个安装到呃 u 盘就可以了，等它安装啊开始制作。这个我们稍等一下， 我们现在呢就需要把我们想要安装的这个欧喷刀波 t 的固件，还有一个写盘工具呢，把它放到我们制作好的那个 peu 盘里边，这边呢跟大家准备了两个固件，一个是伊斯尔的 高大全，一个是精品小包，都是他二二年刚刚制作的啊，一四二的固件还是。呃，都不错的，那我们下载完这个固件之后，我们是需要解压一下的啊， 好，解压完以后我们可以看一下他只要是 i m g 格式的一个镜像文件呢，他就对了。 好，现在呢我们把这个制作好的 pu 盘放进去，插到这 usb 上面，然后这边呢接一个键盘 充电之后呢就会启动按 dna 的键容进入 boss 之后，我们找到这个 boot 这个选项，然后我们往下翻，如果你之前电脑上面那个硬盘他是没有系统的，呃，他有时候会默认第一项就是你的 u 盘，如果不是 u 盘的话，我们把 u 盘呢改成第 一个启动像，然后呢就可以了，按 f 十保存退出，然后呢他再次启动的话就是这个 u 盘的系统。好，那现在进入的就是 vp 系统。 好，进入系统以后呢，我们首先打开这个叫分区工具的啊，好，然后我们就会看到我们电脑上的这些硬盘了， 这边呢一个是 usb， 他是很明显，另外一个就是我刚刚安装的这个 m 三塔啊，这个里边之前我是安装过系统的，所以呢大家可以看到他这分了好几块，但是一般你是买的新盘的话，他不会出现这种情况，如果出现了这种情况，那你就点 点击这个删除所有分区，然后点击确定好，然后点击左上角的保存，点击试好，然后呢就可以了，如果你之前这个盘里面有东西， 也是需要把它删除所有分区的。好，那现在保存之后呢，我们就直接关掉，现在我们打开我们刚刚放到 u 盘里边的这个写盘工具，我们打开 这边呢选择驱动器这边你一定要看清楚，就是你看清楚，一定要是你写的那个盘， 我这边放的这两个盘，这第一个呢就是那个呃， m 萨塔，第二个是我的三十二 g 的 u 盘，所以它容量有点相似，这个时候你一定要看清楚，然后如果不太清楚，那你就看一下你 u 盘的这个容量是二十八，那肯定不是这个二十八 啊，我们选择一定要选择对，好，现在我们再点击我们准备好的那个镜像文件，那这边呢？这个镜像呢？你一定要确认一下这个是不是 img 后缀， 如果是他才是一个镜像，如果你下载下来没有解压，他是一个 vip 或者是 ol， 他这个压缩格是写入是不管用的啊。好的，现在我们直接点击打开，然后点击开始点击是。好，那现在呢就开始写入这个系统了 啊，写入速度也是非常非常的快。 好，大家可以看镜像写完了啊，就是这么快，镜像写完了，写完之后最好你要去检查一下这个分区工具，我们打开 看一下你写好的这个盘是不是这样子就是一块一块的啊？如果他出现了这种情况，那你的 open double t 的这个固件呢？就已经写成功了。好，那其实你看一下这个 open dope 固件，大家可以看一下，这个固件其实占了很小很小的一部分，那其实这边有二十九个，这都空闲的，所以如果你只是安装一个 open wt 的这个固件的话，那是不需要多大这个硬盘空间的， 甚至我觉得你用一个 u 盘，你不想买这个硬盘的话，用一个 u 盘把这个镜像写到 u 盘里面，其实也可以直接呃做一个软陆油的系统，但是那个相对来说不是很稳定。把我们电脑上的这个 vp 盘拔掉，我们重启这个系统。 好，大家可以看一下，如果你接显示器的话，现在他已经开始进入这个呃 open double t 的固件这个系统里边了，然后我们按一下回车键，看到了吗？ 现在就已经显示了，那现在我们可以在这个地方呢来修改你的 ip 地址，那样呢我们也可以用另外一种方式呢修改这个 ip 地址，那这边呢还是建议大家直接在这修改， 我们在里面输入这个 vi 空格， etc 斜杠 config， 斜杠 nice work。 好，输入这串代码之后，我们按一下回车键，那这个时候呢就会出来一大串的这个我们就可以看到，我们找到这个烂口，就是这个烂口可以看到这边呢有一个 ip 地址， 因为一四二所有的固件他的 ip 地址都是幺九二点幺六八点五点一，那现在我们把这个 ip 地址呢改成你家里的这个 ip 地址，或者是你想把它改成多少啊，你就改成多少，这个你随意啊，那如果我不改的话也是可以的， 我们要改的话，我们在键盘上面输入这个瑞赛的键，然后我们在这个键盘上面按住这个银赛的键，然后我们把这个光标呢放到这个这个地方，我们想改哪里你就改哪里，然后呢删除，把这个五删除， 然后，然后比如说我们给他改。这边注意我们在输入二字的时候，一定要用你大键盘的数字，不要用你小键盘的数字，小键 键盘的数字会出问题的 啊，好，现在我们就可以按这个退出键， 按左上角的 esc 退出，然后呢输入冒号 wq， 按回车键，好，当出现了这个地方，当出现了这个，然后呢我们就退出了，然后我们重启一下，我们输入 reboot， 重启一下我们的软路由系统， 那这样呢，就改成我们刚才改的这个 ip 地址了。第二种设置 ip 的方式呢，也是非常简单，我们用一根网线，一头连接我们的软路油啊，一头呢连接我们的这个电脑，随便找一台电脑插上网线啊，然后我们找到这个 网络，然后找到我们的这个网络与状态，找到这个网络更改设备器，我们可以看到这个仪态网这块啊，这仪态网呢？我们呃点击属性 ipv 四，我们可以看到这个 ip 呢，他是自动获取的，我们软陆有安装的伊斯尔的这个固件呢，他是默认的是幺九二点幺六八点五点一， 那所以我们这边呢也给他改成一个网段，一个网段就是幺九二点幺六八点五 点多少，最后一个数字呢，可以在二百五十五之内都可以随便的可以改啊，比如说我们给他改成五吧，五点五，这紫烟码先不用管他啊，然后呢 我们不用管他，那现在呢？这个呃默认网关我们也可以给他设置一下，其实不设置也可以，如果你想设置的话，也是可以默认网关就设置成这个刷的软路由的这个网关幺九二点幺六八点五点一。好，那现在呢啊， 我们点击确定，这时候我们的这台电脑呢，就会跟我们的这台软路由相连，然后我们稍等一下， 现在显示的是未识别的网络，那现在我们直接打开一个浏览器啊，幺九二点幺六八点五点一，就是我们刷的软陆油的地址， 如果呢，现在如果你能够进入这个 open double t 的后台，那说明前面一切设置都是没有任何问题的。那如果你进 过去的话，那这边呢有两个方法，第一个呢，就是你把软路由上面的那个网口你换一个网口，因为它上面有四个嘛， 所以你随便的先换一个，然后试一试这个网线啊，要插在呃软陆油的第一个口就是标注 eth 零的这个上面，你这样连接电脑的时候呢，他就识别率就识别比较快啊，那现在他就已经识别了 啊。还有一种方法呢，就是我们点击这个地方，然后禁用，禁用了之后呢再启动，比如后我们可以可以看一下这个软路由的基本情况，我们往下翻， 这边呢我们就可以看到有一个口已经是连接了。呃，有很多小伙伴担心就是这个固件有没有十配这个二 i i 五的这个英特尔的网卡，大家大家可以看到最新的呃 east， 而变异的这个固件呢， 最新的已经集成了这个 i 二二五的驱动了，所以他会自动的识别。呃，可能有小伙伴出现这种问题，就是大家要明白一个问题，就是如果你电脑不是 二点五 g 的网卡，那你插上之后他会显示是一千兆。呃，你必须是电脑上面也是啊，二点五 g 的网卡，他才会显示是二点五 g 的，那我电脑上面是用的一个 usb 的二点五 g 的一个网卡 啊，所以会显示二点五 g 的。还有一种情况就是你网线如果网线是不达标，他有时候是不会显示二点五 g， 可能会显示一百兆啊，或者是其他的。所以如果大家出现了不是识别二点五 g 的问题的话，呃，你要去检查你的网卡还有这个网线，这个设备 是二点五 g 的，没有任何问题，包括固件也是完全支持的。好，现在我们就进入这个软路由的后台了，现在我们第一步需要设置的就是设置这个接口，然后我们找到网络，找到接口， 我们可以看到这里边有这么多啊，其实你不需要看那么多，你只需要看一个烂口 和一个腕口就行了，我们所有路由器上面都有烂口和腕口啊，如果你不知道咋回事，你可以去看一下，随便找一个这个无线路由器都可以啊。那现在我们先来设置这个烂口啊，然后我们点击这个修改 我们这个烂口呢，我们会看到进入之后有一个 ip v 四的一个地址，这个就是我们路由器软路由后台的地址，我们想要设置就输入这个地址，就会进入软路由后台。那 同样如果你想改的话，也是可以改的，改了之后这个呃软路由后台登录的地址呢？也就改了， 所以这个答案要清楚，不然你乱改的话，最后进入不了软路和后台，那你就需要重新的去刷这个系统了。好，这个知道，我们知道之后呢就不需要管他了，然后这个网关我们可以给他，就是设置成前面这个 ip 地址就行。 那这边呢？这个那 dns 呢？你可以随意的设置，比如说我们设置阿里云的二二三点五点五点五都可以 啊。然后呢你也可以加一个谷歌的八点八点四点四，或者八点八点八点八都可以，同样你也可以再加个幺幺四点幺幺四点幺幺四点幺幺四啊， 然后这些都是你可以随意的去加上去的，同样你也可以看你本地的 dns 是多少，加上去就可以了，那其他的我们都不需要去管了。然后我们先进行一个保存， 修改完以后呢，我们还需要进行一个物理接口的设置，物理接口的设置呢？呃，大家可以看一下，他默认的是没有这两个打勾的，我是设置完的，默认的是 e t h 零，因为我这个网线 是接在 eth 零的， eth 零就是我们在路由器软路由上面会标注一个接口，它上面就是 eth 零，就是第一个接口。那如果你想把其他的接口也设置成烂口的话，我们就需要打钩，我们只需要留一个口给万口就行了，因为我们补 通的家庭一般都是一个呃，一一个线路，一个光纤，一个宽带入户的，所以如果你是两个宽带，三个宽带的话，你可以设置 多多个万口，把这个网线合并到一起也是可以的，但是一般家庭都是一个。那这边呢？如果你不知道我在说什么，没听懂的话，那你就按我这个去操作就行了，把这个一二三啊全部选上啊，这边呢选择这个调节接口啊， 然后最后呢我们点击保存，现在我们再来设置这个万口，进入万口之后，首先我们设置这个物理设置， 然后这边呢这个接口你要选择 eth 三，因为刚才我们已经把 eth 零一和二全部分给了烂口，那这个腕口呢就 只能占这个 eth 三了，那大家明白这个意思就行，如果你还听不懂，那你就按我这个设置就行了啊，最后呢我们点击一下保存和应用， 然后呢再回到这个腕口这边啊，如果呢这边呢这个腕口需要设置的地方呢？就是看你目前想要把软陆油作为啊 啊主路由还是二级路由或者是三级路由，那什么意思呢？就是我们来可以看一下啊，就是呃，我们普通的家庭，如果你之前你的光猫没有调节的话， 那你的光猫和路由器都是一体的，就是你的光猫上面是自带路由器功能的，那现在呢它就是一个一级路由，那你想要用软路由的话，那你可以把它作为一 个二级路由，二级路由的话就是你这边需要设置的这个就是这个 ip 地址，不要跟这个一样就行，他默认的是幺九二点，幺六八点一点一，那我们可以给他设置这个省，比如说我们默认的是五点一 啊，或者是设置成啊六点一，七点一，八点一，十点一，都是可以的，都可以啊，只要不跟他冲突就可以，那这样的话你的 软路由他就是一个二级路由，如果是二级路由的话，我们这边呢就不需要改了，大 就是默认的 dhcp 就可以了，不要管就可以了。然后从我们的一级路由，然后从我的路由拉出来一根线，然后我们把它插在这个地方， 好，我们 把它插在腕口上面，那我们现在呢就去连接我们的一台电脑，那这根线呢是连接的我目前的这台电脑，然后呢我们就可以把它插在一二零一二上面，都可以，因为零一二是烂口。好，这个时候呢你的腕口 大家可以看一下你的这个腕口上面呢，他就会自动的出现这个连接的这个状态，我们看一下这个腕口上面他已经有数据了，看到了吗？已经有了，那说明刚才设置的是完全没有任何问题的， 那现在这个烂口啊也是已经连接了，他已经开始分配 ip 了，也是完全没有任何问题的。还有一种情况呢就是你想要让你的这个呃软路由去拨号，软路由拨号的话，那他 就只是一个光猫，然后呢他接出来这个线呢，然后接到这个上面，然后呢他需要进行拨号上网， 那这个光猫呢是需要进行调节才可以实现这个功能，并且光猫还需要有一个管理员的账号和密码， 这个呢我这边呢就不跟大家展开去说了，然后这个大家去别的地方去补一下课，可以去找到这些很多的教程光猫如何调节，调节完以后我们就可以让我们的这个软鹿油进行啊 拨号作为主路由了，那想要作为主路由的这个情况，那我们就可以在这个路由器里边，然后找到这个万口， 然后呢找到这个 pppoe， 点击一下切换，那这边呢我们输入我们 的宽带账号和密码，然后点击保存，应用完以后，那你家里就可以正常上网了 啊。今天的这个教程呢，确实有一点啰嗦啊，其实我的意思就是说想让刚接触软陆游的或者即将要接触软陆游的这小伙伴呢，能够尽量的去听懂啊，如果你实在听不懂，你就按我的去设置就行了， 如果大家在设置过程中出现了什么问题解决不了，可以在视频下方留言，我看到的话就会第一时间回复大家，同样大家可以进入我的电脑群，我们今天呢就给大家分享到这里吧，我们下期再见，拜拜。

再把这个整个这个啊，这个基础的一个开发环境啊，再来把它完全整合整合一下啊。那么首先我们刚才看到了这个旁边有是有边框的话，呃，有这个外边锯的，所以我们把它这个外边锯给去掉，是吧？有些公共的样式我们把它给去掉，是吧？那这里有些公共的东西啊，粘过来 啊， s ss 下面啊，弄过来，是吧？首先那这个样式的话，我们肯定要要引入到我们这些框架里面去，是吧？所以我们首先要把它引入到这个公共的这个，哎， ngs 比如说他的这个 入口函数里面的是吧？入口函数里面引入进去，那引入进去之后我们这个外边去他就没了，是吧？啊？这是一些公共的基础的这些样式啊，公共基础样式啊，那么大家在开发的时候肯定会会用到，对吧？用到实际的每个项目打点都会有这些公共的样式导入的 好，那么上面还有一个，呃内容，嗯，是什么的路由内，你肯定要去配好啊，我们不然的话我们就需要去在这个啊上面啊，一个去切换什么？切换这个组件啊，才可以去换，那么我们这样 不合适的，所以呢，我们这里用到了这个 fu 框架的一个路友，对吧？这个路友，那这个路友的话啊，我们也加一个 lot 文件啊，说加一个 lot 文件夹啊，直接在 src 下面 有抖音讲，然后在这下面建议一个叫 indice gs 是吧？ index js 啊，这个用来配置我们这个，呃，陆游的是吧？用来配我们陆游的啊，那么还有我们需要去安装一些东西，是吧？安装啊这些， 那我们首先安装的这个是 lot 啊，三点五二，我们看下这里唐默认有没有给我安装啊？默认是没有的，对不对？所以我们默认把这个 lot 给他拿过去呗，是吧？ 那我们基础现在用到的，嗯， lot 需要拿过来，那么我们还有用到的一个主见叫做，嗯， ipad u i， 那么这个是基于二点零的啊，二零的 fu 的，对， imen ui 是基于二点零的，我们要用一下他的些基础的主见，嗯，然后去做开发，好看一点嘛，是吧？好，那么这个的话我们再来。呃，用 npm 一是多少钱就可以 这两个总监给他下一下啊，这需要耐心等待一下 啊。这个还是比较快的，是吧？已经已经下好了啊，这两个组建已下好了，那么下好了之后我们需要去配置他这个，嗯，他们以外还有，比如肉体，是吧？那么这两个呢？我们首先看一下这两个啊，首先把这个引进来呗，是吧？这，这这两个引进来，是吧？ 这是 ipid 啊，这个是优点，是吧？啊，那么还有这些 os 的这基础样式啊，也把它引到这个润滑树里面来，还有一个 rot 啊，他的那个路友，对吧？也引到这里来， 好，那我们就放这呗，是吧？啊？ rot， 是吧，那么这个 rot 来说明一下它引入的解释，这是这个 index g s， 是吧？因为我们这个它名字叫 indice g s， 可以默认写到这个 rot 这个文件夹，这个就可以了啊，它会长成 index g s 啊，那么这个就是录，录一个 view 的，这个录一个 view 的，呃，一个，呃，组建，是吧？录一个飞鱼的对象，那么有一个飞鱼的对象之后，我们要把这个 呃配置上去，对吧？改成我们自己的配置了，对吧？下面还要说有我们直接用这个吧，对吧？当然你用这个也是可以的，是吧？也是可以的啊，比如我们这个说明我要挂在哪里，是吧？挂在哪里啊？然后他这个 logo 啊，要放，放上去啊，放上去，放上去啊，那我们还是按照我们这个这个写法吧，是吧？ 这个其实也是一样的，渲染这个 app， 然后挂的到这个哪里去啊？挂的到我们这个呃到网上去，对吧？ app 这这个 id 上去。好，那么这个 mangs 的话我们来改一下吧，啊，看一下这个也是一样的，他的呃表达是就是这个这个 id 这个 id 上面去，把路由挂在这个上面去，把这个 app 挂到上面去啊，这个路由啊，在使用许愿池这个路由啊，他的组建是哪个组建呢？是 app 这个组建 渲染这个 app 这个组建模板啊，那么有的这些啊，我们还有个地方就是我们的艾美丽欧巴亚啊，这个还需要进行使用，对吧？让我们的 bu 对象啊，这个组建全局是使用它啊。啊，这个默认的配置，我给他配上放放 好了，这个基础配置可以了，是吧？好了， 好，那么这个 fu 和 ivo 呢？这个的 rot 都配置好了，是吧？都配置好了啊，那么我们再要把这个呃 rot 给他弄进来，对吧？ rot 给他弄进来，首先我们要给他一个 就是使用揉腿啊，使用这个揉腿，对吧？啊，那么这个揉腿我们需要把这个揉腿给它倒进来呗，是吧？还有鱼尾对象也要倒进来，对吧？我用的是鱼尾揉成这样，对象，把它倒进来啊，不然的话你怎么使用呢？对吧？好，给它倒进来，然后我们需要最后面就是要配着我们这些组件，对吧？配这些组件， 那么这些组件啊，他的路由啊，就需要给予这个，比如柔软性创建一个柔腿，是吧？然后啊好，创建柔腿，那么这个需要把这个柔腿给他导出去，对吧？默认暴露出去，暴露出去的话，那我们这 面夹子啊，就可以这个揉揉，他这下面就可以用到这个揉它的，所以我们需要把它放进来，对吧？放进来，首先呢我们用的是这个 hello， 对吧？那么 hello， 我们把这个 hello 放到这个文件夹下面，对吧？这个组件，那么我们需要去构建一个文件夹。 零一 open nairs 啊，入门，是吧？入门啊，那我们把这个你就放在这里呗，是吧？把这个组建就放在这里啊，好，那我们快点一下，可以直接点进去，那就是对的，是吧？那就是对的， 好，那么我们呃，还要去配置这个组建呢，对不对？配置组建好，那么配置这个组建的话啊，我们来看一下这个下面有个 rotos， 然后这里下面就是他的一些组建的一些路由，对吧？组建一些路由啊，那我们这个 再把它加进来啊，加个中国号的，是吧？如果再有其他的组件要基于这个什么这个路径来进行，就是这个 pass 啊，这个这个路径啊，来进行路由到这个组件的话， 其他的那么在后面加就可以了，你这个啊，路由的他再加就 ok 了，是吧？再把这些组件导进来就可以了，是不是？好，那我们现在是路由到这里，这个他的路由已经拍完了，那么还有一个问题，这是我们要去加一个菜单栏，是吧？注册菜单栏，然后让他可以点击，然后跳，跳到某一个，你们来，是吧？好，所以我们要加一个什么布局，是不是？所以加个布局的话，我们这里就加了一个什么的 全局的 index 啊。 index 我们就把 index 的体面给它放进来，是吧？ 我看我这个袋子是不是放在这个空袋子，没有放在空袋里面去，是吧？我就直接放到外面的，是吧？ 也就是说我们所有的，呃，这个都基于这个 index 进行布局啊，我们把那些呃 idui 把它倒进来啊，这其实就是 idui 里面的这个组件啊，我们可以看一下啊，搜一下那个 mui 啊。这个如果说你中后全能开发的话，这个呃还是经常用的，对吧？ 经常用的，我们有一个叫布局的东西，是吧？这里有个布局，怎么样去布局的？我们就是一个左右的布局，是吧？那我们就找一个简单的 布局布局容器，你看我们这个用的是啥？用的是空空灯的，是吧？容器。左右布局的容器啊，这是上下的，对吧？我们直接找个这搞个左右的就可以了，是吧？左右的，然后我们直接把这个代码显示出来，对吧？拿一个布局，这个是左侧的，还有菜单，是吧？紫菜单什么的啊，在这都有啊。啊，那我们也是按照这样去配的啊，按照这样去配的啊，这个是整个框架，是吧？整个容器，然后是左侧的，这个是我们的这个 左侧菜单拿啊，这个是我们显示区域，显示区域的话，那么这个是 rosefuel， 是吧？那么这个 rotevefuel 的话，就是说你在这里配置的这个 rote 啊，所有的都往哪里跑，往哪里显示啊？就是往这个上面的 ui， i 们的 ui 里面的这个，呃，这个主区，对吧？主区在这里都有的，也就是说你把这个 这标签写在哪里啊？那你这里你的路由就往哪里什么展示，你说所有的主见都会挂的到这里来啊，挂到这来。好，那我们这里还缺一个什么呢？缺一个左侧的菜单单，是吧？左侧的菜单单我们这里也写在这，是吧？我们没有那么多 啊，没有那么多，所以我们刚开始的话没有那么多。我先首先把它粘过来啊，把不要的，我们把它去掉，是吧？把它去掉，我们一点一点的来。好，好，那么这个的话，呃，我们就是一个快速开始，大家看一下，这个就是紫紫菜单，对吧？这就是紫菜单，你看这个地方的这个地方，嗯，你说六十个哈喽，你说六十个哈喽 啊？哎，这个为什么有个飘红的，我们来看一下啊。 这个是逗号，这个逗号我应该是去掉了，应该是没毛病的，是吧？没毛病的，这个，这个应该是没。哦， 少了一个啊少了一个，少一个括号啊，少一个大括号，是吧？少一个括号，然后导致这个没法闭合，好啊，我们这个就是我们的快速啊， 快速入门这个组建，是吧？那么这个是内蒙对不对？这个内蒙对应的谁对应的？就是这个 pass 啊， pass 呢？然后点这个左侧菜单，然后就来到这个组件，然后这个组件最后挂在哪里？是不是挂在这个地方，对吧？挂在这个地方好，嗯， 好了，那么这个的话，呃，这是我们放到这个，呃艾特里面的数据，也就是放到我们这个，呃，第一个这个数据这个对象里面的啊，那么我们这个拿菜单就是左侧的菜单，菜单就是这个 iman， 也就是说我把这个地方的什么这些菜单啊单独抽出来作为一个组件放到这个来历追寻里面去的，是吧？然后再引入到哪里去？引入到这个 index 里面去，是不是也就是放在这里啊？啊？这个 e l site 啊， 在这里，对吧？我把它这一块放到另外一个主界面去，然后再动态渲染，是不是不能去渲染的好，那么这个渲染的话是依据哪个数据？是，是不是依据这个数据类比利斯特啊？所以它这个是依据于这个类比利斯的去渲染啊？也就是说大家可以来看一下这个是菜单，对吧？那么它这个数据是属于这个进行便利的，是吧？基于这个是进行便利。 嗯，然后呢？这是他的这个菜单，这个啊， sun 就是他的这个图标，是吧？标题图标和标题，那么这个下下面就让紫菜单菜单的名字呗，菜单的名字是吧？虽然这个紫菜单啊，就这个，对吧？ 这款是他的名字和他的路由，是吧？啊？都在这名字在这里啊，路由应该是在这里，对吧？你点的这个应该是的话，那么也就是说他这个就是激活这个路由，对吧？激活用这个路由去激活，然后他就会去按照这个已经配置好这个路由啊，进行定向到这个什么这个组建上来啊，这这样的这样的一个过程啊，这样的过程啊，那么这个呢？呃，我们看一下这个是正常变异的是吧？应该是 啊，都是正常便宜的，我们再看一下这个有没有过来啊？好像没有，是吧？好像没有， 没有，没有展示出来啊，还是还是那样的一个 app， 是吧？啊？我们先我们来重启一下吧。好，你这个零一部门这个应该是 没有错的。 好，现在我们的陆游，呃，把他那个菜单布局都是配置好了的，是吧？ 啊？跟这边应该是没有什么区别，是吧？没什么区别，这是他的全局布局的 index 啊，这个是他的这个路由，对吧？菜单左侧菜单啊，这些钥匙我应该都是加了的啊，因为直接复制过去应该是都是都是有的啊，都是有的 啊，现在是可以了。哎，他这个布局没有过来 啊不仅没有过来，我们看一下具体的问题，是吧？那么这个 app 啊，我们这个用的是什么呢？用的是这个啊，哈喽，是吧？还是用的是哈喽。那我们这个 app 这肯定再不能用哈喽了呗，直接得用这个银戴斯，是吧？那么全局都是用这个银戴斯的啦，对吧？那这个就不能再用哈喽 是吧？因为我们用这个组建做了一个，嗯，整个路由是吧？做了整个路由换一个靠过来，这个点可以的，是吧？我们再来刷新一下，他说这里有两个问题，这个，嗯，已经 这里有，有问题吗？ 应该是没有问题了， 肯定又是又是这个这个变异的问题了，我们再来重新启动一下，看行不行。 哎，他说这个还是这个，我们来搜一下这个，这个是啥意思啊？应该就是那个，呃，检查不通过的问题。 嗯， 我们把这个放这里加一个这个配置里面加加加一个东西，对吧？看一下行不行啊？ 啊？这个改了配置，这个也要重启一下。 好，这个稍等一下。啊。啊？这个，这个，这个什么？ es max， 这个检查挺棒的，是吧？ 啊？现在就可以正常变音通过了，是吧？正常变音通过，我们看一下来看这个左侧就就可以了，对吧？说明他路由也是生效了，是吧？路由也是生效了的啊，哎，看到对吧？好，那么这就是我们的这个啊，整个 u 的这个，我们类似的这个框架啊搭建。