显示商品分类列表页面

Dear 丶 2022-05-27 00:52 246阅读 0赞

1.wxml页面代码：

< view  class = "btn-sudoku">

< navigator  url = "../listdetail/listdetail"  class = "nav-item">

< image  src = "../../images/type/subnav\_01.png"  mode = "aspectFit"  class = "icon" / >

搜索

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_02.png"  mode = "aspectFit"  class = "icon" / >

客服

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_03.png"  mode = "aspectFit"  class = "icon" / >

订单

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_04.png"  mode = "aspectFit"  class = "icon" / >

收藏

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_05.png"  mode = "aspectFit"  class = "icon" / >

团购

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_06.png"  mode = "aspectFit"  class = "icon" / >

预售

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_07.png"  mode = "aspectFit"  class = "icon" / >

秒杀

</ navigator >

< navigator  url = "../listdetail/listdetail"  class = "nav-item"  >

< image  src = "../../images/type/subnav\_08.png"  mode = "aspectFit"  class = "icon" / >

活动

</ navigator >

</ view >

2.wxss页面代码：

/\* 所有分类显示 \*/

.btn-sudoku \{  display:  flex ; justify-content:  space-between ; flex-wrap:  wrap ; background:  \#fff \}

.btn-sudoku  .nav-item \{  width:  25% ; text-align:  center \}

.btn-sudoku  .icon \{  width:  70% ; height:  131.25 rpx ; padding:  10%  15% ;\}

3.运行截图：

![307_method_get-resource_shareToken_D86E2BBD072C40B68B8D202915677E76_entryId_192425475][]

**小程序教程地址：[小程序教程集合地址][Link 1]**

**如果大家对文章有什么问题或者疑意之类的、想要源代码的、想看更多此类文章的，都可以可以加我订阅号，订阅号上面我会定期更新最新博客和资源。 如果嫌麻烦可以直接加我wechat：lzqcode**

![306_method_get-resource_shareToken_D86E2BBD072C40B68B8D202915677E76_entryId_192425475][]

[307_method_get-resource_shareToken_D86E2BBD072C40B68B8D202915677E76_entryId_192425475]: https://note.youdao.com/yws/api/group/67516516/noteresource/88676AC0DA5E4715B78078C7217EB261/version/307?method=get-resource&shareToken=D86E2BBD072C40B68B8D202915677E76&entryId=192425475
[Link 1]: https://blog.csdn.net/linzhiqiang0316/article/details/79858852
[306_method_get-resource_shareToken_D86E2BBD072C40B68B8D202915677E76_entryId_192425475]: https://note.youdao.com/yws/api/group/67516516/noteresource/B00BDB44280347869CD3B6243E774BF2/version/306?method=get-resource&shareToken=D86E2BBD072C40B68B8D202915677E76&entryId=192425475

发表评论取消回复

表情：

评论列表（有 0 条评论，246人围观）

还没有评论，来说两句吧...

相关阅读

相关 07-08 Flutter仿京东商城项目商品分类页面布局：Flutter仿京东商城项目商品分类页面数据渲染...

Flutter实战(交流群：452892873) 本项目是一个实战项目，根据目录建文件，并复制从第一节到最新更新的文章，可以构成完整的一个请求后台数据的项目： ![1057

比眉伴天荒/ 2023年08月17日 15:58/ 0 赞/ 165 阅读

相关 day04 - 商品管理（商品分类+分类参数）

目录今日目标 1.商品分类 A.新建分支goods\_cate B.创

系统管理员/ 2022年12月24日 07:58/ 0 赞/ 198 阅读

相关 vue多个商品选择与列表显示

// mock数据 classRoom: [ { "id": "598", "name": "初中课程全套", "n

超、凢脫俗/ 2022年12月22日 06:30/ 0 赞/ 141 阅读

相关 iOS好友列表根据姓氏分类显示实现

最终效果 ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0

Love The Way You Lie/ 2022年11月21日 15:14/ 0 赞/ 121 阅读

相关 html5 商品分类页面效果

因为现在要做有关电商方面的东西，刚好要做做这个商品分类页面的展示工作，所以我就把它独立出来了，直接下载html文件在浏览器运行就好了。效果图如下： ![Center][]

爱被打了一巴掌/ 2022年06月17日 03:09/ 0 赞/ 176 阅读

相关显示商品分类列表页面

1.wxml页面代码：  < view class = "btn-sudoku"> < navigator url = "../li

Dear 丶/ 2022年05月27日 00:52/ 0 赞/ 247 阅读

相关 vue.js (商品分类)

<!doctype html> <html> <head> <meta charset="utf-8">

古城微笑少年丶/ 2022年05月18日 02:40/ 0 赞/ 161 阅读

相关 layui商品分类树显示

\layui商品分类树显示实现效果图 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR

痛定思痛。/ 2022年04月02日 03:22/ 0 赞/ 353 阅读

相关无序列表ul、定义列表dl商品分类栏

无序列表ul、定义列表dl商品分类栏 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR

喜欢ヅ旅行/ 2021年07月25日 15:30/ 0 赞/ 464 阅读

相关商品管理系统商品分类树查询

一数据库表结构 DROP TABLE IF EXISTS `pms_category`; CREATE TABLE `pms_category

r囧r小猫/ 2021年07月24日 18:20/ 0 赞/ 550 阅读