彼岸梦想花开的个人资料

代码4 Component({ options: { addGlobalClass: true, pureDataPattern: /^_/ }, properties: { duration: { type: Number, value: 500 }, easingFunction: { type: String, value: 'default' }, loop: { type: Boolean, value: true }, videoList: { type: Array, value: [], observer: function observer() { var newVal = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : []; this._videoListChanged(newVal); } } }, data: { nextQueue: [], prevQueue: [], curQueue: [], circular: false, _last: 1, _change: -1, _invalidUp: 0, _invalidDown: 0, _videoContexts: [], list:[ { imgUrl:"../../static/index/[email protected]", title:"看直播" }, { imgUrl:"../../static/index/收藏 (1)@2x.png", title:"收藏" }, { imgUrl:"../../static/index/[email protected]", title:"客服" }, { imgUrl:"../../static/index/分享@2x.png", title:"分享" } ], // 遮罩层是否显示 show:"none", // 商品预订单 shopOrder:[ { size:"S", price:"108.20" },{ size:"M", price:108.20 } ] }, lifetimes: { attached: function attached() { this.data._videoContexts = [wx.createVideoContext('video_0', this), wx.createVideoContext('video_1', this), wx.createVideoContext('video_2', this)]; } }, methods: { _videoListChanged: function _videoListChanged(newVal) { var _this = this; var data = this.data; newVal.forEach(function (item) { data.nextQueue.push(item); }); if (data.curQueue.length === 0) { this.setData({ curQueue: data.nextQueue.splice(0, 3) }, function () { _this.playCurrent(1); }); } }, animationfinish: function animationfinish(e) { var _data = this.data, _last = _data._last, _change = _data._change, curQueue = _data.curQueue, prevQueue = _data.prevQueue, nextQueue = _data.nextQueue; var current = e.detail.current; var diff = current - _last; if (diff === 0) return; this.data._last = current; this.playCurrent(current); this.triggerEvent('change', { activeId: curQueue[current].id }); var direction = diff === 1 || diff === -2 ? 'up' : 'down'; if (direction === 'up') { if (this.data._invalidDown === 0) { var change = (_change + 1) % 3; var add = nextQueue.shift(); var remove = curQueue[change]; if (add) { prevQueue.push(remove); curQueue[change] = add; this.data._change = change; } else { this.data._invalidUp += 1; } } else { this.data._invalidDown -= 1; } } if (direction === 'down') { if (this.data._invalidUp === 0) { var _change2 = _change; var _remove = curQueue[_change2]; var _add = prevQueue.pop(); if (_add) { curQueue[_change2] = _add; nextQueue.unshift(_remove); this.data._change = (_change2 - 1 + 3) % 3; } else { this.data._invalidDown += 1; } } else { this.data._invalidUp -= 1; } } var circular = true; if (nextQueue.length === 0 && current !== 0) { circular = false; } if (prevQueue.length === 0 && current !== 2) { circular = false; } this.setData({ curQueue: curQueue, circular: circular }); }, playCurrent: function playCurrent(current) { this.data._videoContexts.forEach(function (ctx, index) { index !== current ? ctx.pause() : ctx.play(); }); }, onPlay: function onPlay(e) { this.trigger(e, 'play'); }, onPause: function onPause(e) { this.trigger(e, 'pause'); }, onEnded: function onEnded(e) { this.trigger(e, 'ended'); }, onError: function onError(e) { this.trigger(e, 'error'); }, onTimeUpdate: function onTimeUpdate(e) { this.trigger(e, 'timeupdate'); }, onWaiting: function onWaiting(e) { this.trigger(e, 'wait'); }, onProgress: function onProgress(e) { this.trigger(e, 'progress'); }, onLoadedMetaData: function onLoadedMetaData(e) { this.trigger(e, 'loadedmetadata'); }, trigger: function trigger(e, type) { var ext = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; var detail = e.detail; var activeId = e.target.dataset.id; this.triggerEvent(type, Object.assign(Object.assign(Object.assign({}, detail), { activeId: activeId }), ext)); }, showPopup (){ const _self = this; console.log(2222); let animation = wx.createAnimation({ duration: 500, timingFunction: 'ease', }); animation.translateY(-554).step() this.setData({ ani: animation.export(), },function (){ _self.setData({ show:"block" }); }) }, onClose (){ const _self = this; let animation = wx.createAnimation({ duration: 500, timingFunction: 'ease', }); animation.translateY(555).step() this.setData({ ani: animation.export(), },function (){ _self.setData({ show:"none" }); }) } }});

代码2 .container{width:100%;height:100%}.video-swiper{width:100%;height:100%}.video_item{height:100%;width:100%}.play_btn{ width:120rpx; height: 120rpx; position: absolute; left:300rpx; top:415rpx;}.list{ width:73rpx; display: flex; flex-direction: column; position: absolute; right: 30rpx; top:260rpx;}.item{ width:100%; height: 105rpx; margin-top:30rpx; }.item_img{ width:73rpx; height: 70rpx;}.title{ display: inline-block; width:100%; font-size:25rpx; text-align: center; margin-top:3rpx; color:white;} .goods-introduce{ width:100%; height:280rpx; position:absolute; bottom:0; left:0; padding:0 30rpx; color:white;}.goods-detail{ height: 58rpx; position: relative; margin-left:30rpx; }.goods-detail-icon{ width:51rpx; height: 58rpx;}.look-detail{ display: inline-block; height: 100%; line-height: 58rpx; position: absolute; left:65rpx; top:0;}.goods-name-container{ position: relative; margin:20rpx 0 0 30rpx;}.item-name{ font:600 27rpx "苹方"; width:66%; height: 75rpx; white-space:pre-wrap; }.item-introduce{ line-height: 50rpx;}.item-btn{ width:156rpx; height:50rpx; background:#FF3A6B; position: absolute; right: 70rpx; top:20rpx; text-align: center; font: 500 30rpx/50rpx "苹方"; border-radius:7rpx;}.cover{ width: 100%; height: 100%; position: absolute;}.mask{ background:rgba(0, 0, 0, 0.8); z-index: 1;}.content{ z-index: 9; top:1110rpx; display: block;}.close{ width: 50rpx; height: 50rpx; display: inline-block; border-radius: 25rpx; background:white; text-align: center; line-height: 50rpx; font-size: 40rpx; font-weight: bold; margin:101rpx auto auto 670rpx;}.shop-item-img{ width: 240rpx; height: 210rpx; position: absolute; left: 50rpx; top:125rpx; z-index: 99;}.content-inner{ width: 100%; height: 919rpx; background:white; margin-top:34rpx; position: relative; border-top-left-radius: 30rpx; border-top-right-radius: 30rpx;}.shop-item-price{ margin:10rpx 0 0 50rpx; color: #FF2400; font-size: 40rpx; line-height: 40rpx; font-weight: bold;}.shop-item-title{ margin-top:24rpx; margin-left: 324rpx; white-space: pre-wrap; width: 390rpx; height: 135rpx; font-size: 33rpx; line-height: 45rpx;}.border-one{ width: 670rpx; height:1rpx; margin:22rpx 0 0 50rpx; background:black ;}.color-status{ display: flex; flex-wrap: wrap; margin-left: 25rpx; }.color{ position: relative; padding-right: 20rpx;}.radius{ width: 35rpx; height:35rpx; line-height: 35rpx; text-align: center; color: white; border-radius: 50%; background:#FF2400; position: absolute; top:25rpx; right: 11rpx;}.color-inner{ width: 135rpx; height: 50rpx; border: 3rpx solid #FF2400 ; border-radius: 8rpx; color:#FF2400; text-align: center; line-height: 50rpx; font-size: 35rpx; font-weight: 600; margin:39rpx 0 0 25rpx;}.select{ width: 100%; height: 152rpx; margin-top:48rpx; background: green;}.define{ width: 100%; height:99rpx; background:red; line-height: 99rpx; text-align: center; font-size: 40rpx; font-weight: 500; color: white; position: absolute; bottom: 0;}

代码1 import { videoListSrc } from "../../api/index/index";import { request_post } from "../../config/request"; Page({ data: { videoList:[] }, onLoad (){ this.getVideoListData(); }, // 获取视频列表数据 getVideoListData (){ const _self = this; request_post({ url:videoListSrc }).then(res =>{ this.setData({ videoList:res.data }); }); }, onPlay(e) {}, onPause(e) { // console.log('pause', e.detail.activeId) }, onEnded(e) {}, onError(e) {}, onWaiting(e) {}, onTimeUpdate(e) {}, onProgress(e) {}, onLoadedMetaData(e) { // console.log('LoadedMetaData', e) }})