微信小程序——收藏功能

1.wxml

 <view class="lis">
  <view>{{goodsitem.id}}</view>
  <view>{{goodsitem.goods_name}}</view>
  <view>{{goodsitem.goods_price}}</view>
  <view>{{goodsitem.goods_desc}}</view>
  <view wx:if="{{sign == 1}}" bindtap="click" data-id="{{goodsitem.id}}">
    <l-icon name="user"  size="40"/>
  </view>
  <view wx:if="{{sign == 0}}" bindtap="click" data-id="{{goodsitem.id}}">
    <l-icon name="like" size="40"/>
  </view>
</view>

2.js

/**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    let that = this
    wx.request({
      url: 'http://www.wenk.com/index.php/admin/goodsitem', //仅为示例,并非真实的接口地址
      data: {
        id:options.id
      },
      success (res) {
        console.log(res.data.data)
        if (res.data.code == 250) {
          that.setData({
          sign:0,
          goodsitem:res.data.data
        })
        }
        if (res.data.code == 200) {
          that.setData({
            sign:1,
            goodsitem:res.data.data
        })
        }
      }
    })
  },

  click(c){
    var that = this
    var id = c.currentTarget.dataset.id
    //点赞
    wx.request({
      url: 'http://www.wenk.com/index.php/admin/goodslike',
      data:{
        id:id
      },
      success (res) {
        console.log(res.data)
        if (res.data.code == 250) {
          that.setData({
          sign:0
        })
        }
        if (res.data.code == 200) {
          that.setData({
            sign:1
        })
        }
      }
    })
  },

3. 详情API接口、收藏API接口

/**
     * 详情、且查询是否收藏
     * @return \think\response\Json
     * @throws \think\db\exception\DataNotFoundException
     * @throws \think\db\exception\DbException
     * @throws \think\db\exception\ModelNotFoundException
     */
    public function goodsitem(){
        $id = \request()->get('id');
        $data = (new \app\admin\model\Goods())->where('id',$id)->find();
        //获取用户id
        $uid = 1;
        //判断是否收藏
        $sing = (new Praise())->where('wid',$id)->where('uid',$uid)->find();
        if ($sing){
            return json(['code' => 200,'data' => $data]);
        }
        return json(['code' => 250,'data' => $data]);
    }

    /**
     * 点赞收藏
     * @return \think\response\Json
     * @throws \think\db\exception\DataNotFoundException
     * @throws \think\db\exception\DbException
     * @throws \think\db\exception\ModelNotFoundException
     */
    public function goodslike()
    {
        $uid = 1;
        $wid = input('id');
        $data = [
            'uid' => $uid,
            'wid' => $wid
        ];
        //判断是否收藏过
        $likedata = (new Praise())->where('uid',$uid)->where('wid',$wid)->find();
        if ($likedata == null){
            (new Praise())->insert($data);
            return json(['code' => 200,'msg' => '收藏成功']);
        }
        //已收藏则删除数据
        (new Praise())->where('uid',$uid)->where('wid',$wid)->delete();
        return json(['code' => 250,'msg' => '取消成功']);
    }

4.未收藏

已收藏

 取消收藏

 

 

微信小程序中的video组件是用于嵌入视频内容的组件,它提供了丰富的接口和属性来控制视频的播放、格式、布局等。在小程序中使用video组件,可以实现视频的加载、播放、暂停、全屏切换等功能,且支持H.264、H.265视频格式。 要使用video组件,开发者需要在小程序的JSON配置文件中声明对应的权限,例如访问网络权限,以及在WXML中插入video标签并设置其属性。下面是使用video组件的基本步骤和示例代码: 1. 在app.json中声明需要使用的权限: ```json { "permissions": { "scope.userLocation": { "desc": "你的位置信息将用于视频播放" } } } ``` 2. 在WXML页面中使用video组件: ```xml <video src="视频地址" controls="true" autoplay="false" loop="false" muted="false" initial-time="0" poster="封面地址" object-fit="contain" enable-danmu="false" danmu-list="{{danmuList}}" danmu-btn="false" binddanmu="onDanmu" controlslist="nodownload" enable-airplay="false" enable-pip="false" aired-volume="false" muted-volume="false" enable-progress-gesture="false"></video> ``` 3. 在JS中定义danmuList数据和onDanmu事件处理函数: ```javascript Page({ data: { danmuList: [{ text: '弹幕内容', color: '#ff0000', time: 10 }] }, onDanmu: function(e) { console.log(e.detail) } }) ``` 视频播放器组件支持多种事件,如播放事件、暂停事件、时间更新事件等,开发者可以根据需要进行监听和处理。此外,还可以通过编程式接口如`wx.createVideoContext`创建视频上下文,实现更精细的控制。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值