老师想问一下这里的多个请求怎么发,给点提示

正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

1回答
好帮手慕慕子 2021-12-08 10:03:28

同学你好,仔细观查,二级菜单的url地址前面是一样的,只有最后一个不同,如下:

https://img1.sycdn.imooc.com//climg/61b011c4094f9a6f07650436.jpg

而hot等这些对应着一级菜单设置的data-n选项,所以可以在鼠标移入一级菜单时,获取到它的data-n属性值,然后将url地址进行拼接,获取到请求二级菜单数据的完整地址,然后根据拼接后的地址请求数据即可。

老师这里写一个简单的示例,可以参考如下图结合注释理解:

首先,menu组件实现的目录结构,如图所示:

http://img1.sycdn.imooc.com//climg/60ebb7b3098f0d6902890437.jpg

其次,目录结构中每个文件的作用分别为:

1、v-menu.art为一级菜单组件、sec-menu.art为二级菜单组件,参考代码如图

http://img1.sycdn.imooc.com//climg/60ebb7f709775b3f08950575.jpg

http://img1.sycdn.imooc.com//climg/60ebb7f709c0f5f308120472.jpg

2、v-menu.css为一二级菜单样式,参考之前项目写好的菜单样式即可。

3、images文件夹中为菜单小图标

4、config.js文件为ajax请求的url信息,参考代码如图

http://img1.sycdn.imooc.com//climg/60ebb8310958796709250335.jpg

5、index.js文件,用于实现菜单功能,参考代码如图

http://img1.sycdn.imooc.com//climg/60ebb86009285c5909530578.jpg

http://img1.sycdn.imooc.com//climg/60ebb866093ea12a09910497.jpg

http://img1.sycdn.imooc.com//climg/60ebb86b09e1fd3f11620853.jpg

http://img1.sycdn.imooc.com//climg/60ebb870090dffc610810388.jpg

最后,在index.art文件中设置一个div盒子用于放置menu组件,参考代码如图

http://img1.sycdn.imooc.com//climg/60ebb88b096cbf5c11390417.jpg

祝学习愉快~

  • 老师你好,我看到您的回答:

    https://img1.sycdn.imooc.com//climg/623581b1099b278f10560716.jpg

    鼠标移入一级菜单的时候,根据data-n属性拼接二级菜单地址,请求二级菜单数据,我自己在写的时候也考虑过这样做,但是,当用户多次移入移出的时候,是不是就发起了多次请求?是不是会造成什么性能问题啥的,我觉得发起多次请求不好,所以放弃了这种写法,然后到底怎么写才是最好的

    2022-03-19 15:12:15
  • 目前这样写就可以了。如果想优化一下网络请求,建议提交作业,并写个txt询问一下批复作业的老师。批复作业的老师有同学的全部代码,可以根据具体的代码为你提供处理思路。


    2022-03-19 17:39:00
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师