美食杰项目(七)菜谱大全

本文目录

  • 前言:
  • 1.具体样式
  • 2.实现的具体功能和代码思路
  • 3.element ui具体样式的网址
  • 4.相关代码
  • 5.总结:

前言:

  • 本文给大家讲的是美食杰项目中菜谱大全项目的具体样式,代码思路和具体代码,希望能帮助到你

1.具体样式

美食杰项目(七)菜谱大全_第1张图片

2.实现的具体功能和代码思路

1.头部:根据tab切换筛选点击哪个选中哪个,并将其筛选结果传进路由,根据传进路由的数据进行筛选渲染
tab切换的具体样式是根据element ui里面的具体代码实现
2.左侧:左侧也是筛选条件,点击哪个选中那个并将数据传进路由,根据传进路由的数据进行筛选渲染,具体
样式也是element ui里面的代码实现的
3.右侧:右侧是跟剧筛选数据传给接口接口返回给我的数据,具体样式是根据封装的组件来实现的
并且伴有加载样式也是element ui里面的具体代码
4.右下角:具体样式是根据element ui里面的相关代码实现的,具体功能的实现element ui官网讲解的也很详细

3.element ui具体样式的网址

  • 头部:tab切换 https://element.eleme.cn/#/zh-CN/component/tabs
  • 左侧:Collapse折叠 https://element.eleme.cn/#/zh-CN/component/collapse
  • 加载:loading https://element.eleme.cn/#/zh-CN/component/loading
  • 右下角 :分页 https://element.eleme.cn/#/zh-CN/component/pagination

4.相关代码




5.总结:

以上就是 美食杰项目 中 发布菜谱页的具体实现方法,不懂得也可以在评论区里问我或私聊我询问,以后会持续发布一些新的功能,敬请关注。
我的其他文章

你可能感兴趣的:(美食杰,美食,vue.js,javascript)