大志雄心 2021-01-15 20:00 采纳率: 0%
浏览 51

get传值获取数据的问题,请大神指教

问题是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)

      })

    },

  • 写回答

5条回答 默认 最新

  • 禅思院 前端领域优质创作者 2021-01-15 20:34
    关注

      <li v-for="(item, index) in cates" :key="index" :class="{on:index==currentIndex}" class="menu-item" @click="clickMenuItem(item)">

     

     

    methods: {

        menuList() {

          var that = this

          that.$http.get('/cate')

            .then(function(res) {

              console.log(res)

              that.cates = res.data.data.list

    if (!that.cates.length) return 

    // 默认加载第一个

    this.foodsList(that.cates[0].cateId)

            }).catch(err => {

              console.log(err)

            })

        },

    clickMenuItem (item) {

    this.foodsList(item.cateId)

    },

        foodsList(cateId) {

          var that = this

          that.$http.get('/goods', {

            params: {

              cateId: cateId,

              page: 1,

              rows: 5

            }}).then(function(res) {

            console.log(res)

            that.goodsArr = res.data.data.list

          }).catch(err => {

            console.log(err)

          })

        },

    评论

报告相同问题?

悬赏问题

  • ¥20 校园二手交易小程序搭建
  • ¥15 请问在ubuntu用conda创建环境报错怎么能解决
  • ¥15 STM32CubeMX/proteus按键控制指示灯颜色切换
  • ¥20 python,计算区位熵和扩张指数
  • ¥15 Python环境配置
  • ¥15 大四学生的困惑,有偿提问!
  • ¥15 解决页面无法编入索引:被“noindex”标签排除的问题?
  • ¥15 arduino测量电阻
  • ¥15 快手uid转快手号谁能解决 需要开发
  • ¥15 iis部署Django时css不生效,来个真人,ai不好使