我的远程实习笔记day18---二手校园市场项目（购物车列表）

今天是在第二大学远程实习的第十八天，偷偷发个博客记录一下自己的成长哈哈（今天学习二手校园市场项目）
wxml:

<view class="container" wx:if="{{currentTab ==1}}">


    <block wx:for="{{arrs}}" wx:key="index">


            <navigator class="dyItem" url="/pages/ershou/show?id={{item.id}}">


                <view class="pic">


                    <image class="dyItemPic" src="{{item.Tu1}}"></image>


                </view>


                <view class="txt">


                    <view class="title"> {{item.title}}</view>


                    <view class="info" style="display: flex;justify-content: space-between;padding: 10px;">


                      <text class="dyItemTxt">{{item.newstime}}</text>


                       <text class="red">￥{{item.price}}</text>


                    </view>


                </view>


            </navigator>


    </block>


</view>

 

<view class="container" wx:if="{{currentTab ==0}}">


    <block wx:for="{{wkLists}}" wx:key="index">


        <block wx:if="{{item.userid==userid}}">


            <navigator class="dyItem" url="/pages/show/show?id={{item.id}}">


                <view class="pic">


                    <image class="dyItemPic" src="{{item.titlepic}}"></image>


                </view>


                <view class="txt">


                    <view class="title"> {{item.title}}</view>


                    <view class="info" style="display: flex;justify-content: space-between;">


                      <text class="dyItemTxt">{{item.newstime}}</text>


                       <text class="red">￥{{item.price}}</text>


                    </view>


                </view>


            </navigator>


        </block>


    </block>


</view>

js:

/**

   * 生命周期函数--监听页面加载


   */


  onLoad: function (options) {


    var username = '0'


    var userid = '0'


    var that = this

 

    //展示列表页内容


    this.getWkList()

 

    //获取缓存数据


    wx.getStorage({


      key: "login",


      success(res) {


        console.log(res.data)


        that.setData({


          userid: res.data.userid,


          username: res.data.username,


        })


      },


      fail(res) {


        console.log('无缓存数据', res.data)

 

        console.log(userid)


      }


    })

 

    //获取购物车缓存数据


    wx.getStorageInfo({


      success(res) {


        console.log('所有缓存数据',res)


        var arr = res.keys;


        var arrs = new Array() // arrs 代表 缓存中真正的数组

 

        console.log('arr的长度是：', arr[3])


        for (var i = 0; i < arr.length; i++) {


          if(arr[i]!="logs"&&arr[i]!="login"){ 


             arrs[i] = wx.getStorageSync(arr[i])  //将缓存 数组 赋值给数组对象


            }


        }


        console.log('数组为',arrs)


        that.setData({


          arrs:arrs,


        })

 

      }


    })

 

  },//onload

效果：

小结：
1.购物车列表页将获取微信小程序缓存中的该商品数据，并展示为列表页，如首页列表页类似

2.当用户点击该商品时，将携带商品ID参数发送至商品内容页，即可成功查看商品详情