效果图:
主要思想是:分为三大块 每一块又有四个小块,相当于数组嵌套数组
data的内容:
bigarr: [
[{
image: "/image/mine/mine_1.png",
stae: "余额",
path: "../account_balances/account_balances"
},
{
image: "/image/mine/mine_2.png",
stae: "账单",
path: "../check/check"
},
{
image: "/image/mine/mine_3.png",
stae: "每日流水"
},
{
image: "/image/mine/mine_4.png",
stae: "统计"
}
],
[{
image: "/image/mine/mine_5.png",
stae: "收藏夹"
},
{
image: "/image/mine/mine_6.png",
stae: "我的关注"
},
{
image: "/image/mine/mine_7.png",
stae: "收货地址",
path: "../address/address"
},
{
image: "/image/mine/mine_8.png",
stae: "修改绑定手机",
path: "../change_phone_number/change_phone_number"
}
],
[{
image: "/image/mine/mine_9.png",
stae: "品牌介绍",
path: "../mack/mack"
},
{
image: "/image/mine/mine_10.png",
stae: "意见反馈",
path: "../complaint/complaint/complaint"
},
{
image: "/image/mine/mine_11.png",
stae: "关于我们",
path: "../about/about"
}
]
]
}
.wxml
<view class="index_list1 byb_card list_item" wx:for='{{ bigarr }}' wx:key='' wx:for-item="secLi">
<view class="list" wx:for='{{ secLi }}' wx:key='' wx:for-item="item">
<image src="{{item.image}}"></image>
<view class="list_content" data-path="{{item.path}}" bindtap='jmpTo'>
<text class="left">{{item.stae}}</text>
<image class="right" src="/image/mine/jiantou.png"></image>
</view>
</view>
</view>