购物车（一）-立即购买——switchTab跳转到菜单指定的路径；navigateTo跳转非菜单指定的路径

商品详情-立即购买——switchTab跳转到菜单指定的路径；navigateTo跳转非菜单指定的路径

• 立即购买
  • 先加入购物车，再跳转到购物车页面

toBuy () {
  // 直接购买：添加购物车；跳转到购物车
  this.addCart()
  // switchTab跳转到菜单指定的路径
  // navigateTo跳转非菜单指定的路径
  mpvue.switchTab({
    url: '/pages/cart/main'
  })
}

实例

加入购物车后添加提示

结构

    <!-- 底部菜单 -->
    <div class="footer">
      <button class="contact"></button>
      <div class="footer-left">
        <span class="iconfont icon-kefu"></span>
        <p>联系客服</p>
      </div>
      <navigator url='/pages/cart/main' open-type="switchTab" class="footer-left">
        <span class="iconfont icon-gouwuche"></span>
        <p>购物车</p>
      </navigator>
      <div @click='addCart' class="footer-right">
        加入购物车
      </div>
      <div @click='toBuy' class="footer-right">
        立即购买
      </div>
    </div>

代码

 // 加入购物车后添加提示
      wx.showToast({
        title: '添加成功'
      })

全部：

 methods: {   
	addCart () {
      // 把当前商品添加到购物车
      // 本质：加入本地缓存
      // 第一次查询购物车缓存数据不存在，那么就初始化为空对象
      // 后续再查询时就包含了数据
      let cart = wx.getStorageSync('mycart') || {}
      // {12312: {}}
      if (cart[this.gid]) {
        // 已经存在的商品，数据累加
        cart[this.gid].num = cart[this.gid].num + 1
      } else {
        // 原来不存在该商品，添加一个num属性并且值为1
        cart[this.gid] = this.info
        cart[this.gid].num = 1
        // 添加一个标志位：控制当前商品在购物车中是否选中
        cart[this.gid].checked = false
      }
      // 放到本地缓存中
      wx.setStorageSync('mycart', cart)
      // console.log(wx.getStorageSync('mycart'))
      // 加入购物车后添加提示
      wx.showToast({
        title: '添加成功'
      })
    },
 }

添加购物车提示

立即购买

• 先加入购物车，再跳转到购物车页面

  methods: {
    toBuy () {
      // 立即购买
      this.addCart()
      // 跳转到购物车页面
          // switchTab跳转到菜单指定的路径
          // navigateTo跳转非菜单指定的路径
      wx.switchTab({
        url: '/pages/cart/main'
      })
    },
 }

wx.switchTab()方法，点击立即购买，跳转到tab页