问题是foodsList()获取数据需要传参: cateId,page, rows。
cateId是通过menuList()商品分类可以获取cateId。
但是cateId点击不同的按钮值不一样。怎么获取到?再动态传给foodsList()来获取数据?各位大神,有懂的吗?
html代码如下:
<div ref="menuWrapper" class="menu-wrapper">
<ul>
<li v-for="(item, index) in cates" :key="index" :class="{on:index==currentIndex}" class="menu-item" @click="clickMenuItem(index)">
<span class="text border-1px">
{{ item.name }}
</span>
</li>
</ul>
</div>
<div ref="foodsWrapper" class="foods-wrapper">
<ul>
<li class="food-list food-list-hook">
<h1 class="title">热销榜</h1>
<ul>
<li v-for="(item, index) in goodsArr" :key="index">
<div v-if="item.cate===currentIndex+1" :key="index" class="food-item border-1px" >
<div class="icon">
<img :src="item.img" width="57" height="57">
</div>
<div class="content">
<h2 class="name">{{ item.title }}</h2>
<div class="price">
<span class="now">¥{{ item.priec }}</span>
<!-- <span class="old" v-show="food.oldPrice">¥30</span> -->
</div>
<div class="cartcontrol-wrapper">
加入购物车
</div>
</div>
</div>
</li>
</ul>
</li>
</ul>
</div>
js代码:
methods: {
menuList() {
var that = this
that.$http.get('/cate')
.then(function(res) {
console.log(res)
that.cates = res.data.data.list
}).catch(err => {
console.log(err)
})
},
foodsList() {
var that = this
that.$http.get('/goods', {
params: {
cateId: ,
page: 1,
rows: 5
}}).then(function(res) {
console.log(res)
that.goodsArr = res.data.data.list
}).catch(err => {
console.log(err)
})
},