最近要写一个短视频直播小程序 记录一下评论功能的实现
首先接口返回部分
原先评论列表接口（第一种 返回一级分类。 第二种传一级分类id 返回二级分类数据）
is_child_comment 是否展示更多评论
secondList 二级分类列表
点击评论列表接口 会返回二级评论的id
wxml部分
<scroll-view scroll-y style="height: 640rpx;" scroll-into-view="t{{commentScrollId}}" bindscrolltolower="onPullDown" scroll-top="{{toHeight}}" >
<view class="comment-box">
<view class="comment-list clearfix" wx:for="{{commentlist}}" wx:key="index" id="t{{index}}">
<view class="comment-item-box1-l">
<image class="comment-item-left " src="{{item.headimgurl}} "></image>
<view class="comment-item-right">
<view bindtap="replyInfo" data-name="{{item.nickname}}" data-idx="{{index}}" data-id="{{item.id}}">
<view class="comment-name ">{{item.nickname}}</view>
<view class="comment-time ">{{item.addtime}}</view>
<view class="comment-comtent" >
<text class=" replywidth">{{item.content}}</text>
</view>
</view>
<view class="comment-more" bindtap="getMoreComment" data-idx="{{index}}" data-id="{{item.id}}" wx:if="{{item.is_child_comment}}">—— 展开{{item.child_comment_num}}条回复 <image src="https://p6.suibianyuming.com.cn/ct/video/shopmore.png" class="video-logo-more"></image></view>
</view>
</view>
<scroll-view scroll-y class="comment-s-box-list" >
<view class="comment-item-box-s" wx:for="{{item.secondList}}" wx:for-item="items" wx:key="idx">
<image class="comment-item-left-s " src="{{items.headimgurl}} "></image>
<view class="comment-item-right-s ">
<view class="comment-name-s ">{{items.nickname}}</view>
<view class="comment-name-s ">{{items.addtime}}</view>
<view class="comment-comtent-s " >{{items.content}}</view>
</view>
</view>
<view class="comment-more-small" wx:if="{{item.isMorePage && item.secondList && item.secondList.length != 0 }}" data-idx="{{index}}" data-id="{{item.id}}" bindtap="getSecondComment">—— 展开更多回复 <image src="https://p6.suibianyuming.com.cn/ct/video/shopmore.png" class="video-logo-more"></image></view>
<view class="comment-more-small" data-idx="{{index}}" wx:elif= "{{!item.isMorePage && item.secondList && item.secondList.length != 0 }}" data-id="{{item.id}}" bindtap="loseSecondComment">—— 收起 <image src="https://p6.suibianyuming.com.cn/ct/video/shopmore.png" class="video-logo-more"></image></view>
<view class="clear"></view>
</scroll-view >
</view>
</view>
</scroll-view>
<view class="view-shop-input" wx:if="{{commentShow}}">
<image src="https://p6.suibianyuming.com.cn/ct/video/shopcomment.png"></image>
<input placeholder="献上你的一条热评" value="{{commentValue}}" data-id="0" bindconfirm="confirmInput" bindinput="getCommentValue" maxlength="100" wx-if="{{isCommentOwn}}" confirm-type="confirm" bindfocus ="getFocus" adjust-position="false"></input>
<input placeholder="{{ commentPeople}}" value="{{commentValue}}" data-id="1" bindconfirm="confirmInput" bindinput="getCommentValue" focus="{{focus}}" bindblur="blurSecondInput" maxlength="100" wx:else confirm-type="confirm" bindfocus ="getFocus" adjust-position="false"> </input>
</view>
js部分
// pages/mine/moneyAdmin/moneyAdmin.js
const app = getApp()
let videoDetail = {
videoCommentList: (option, fn) => {
wx.utils.getData('GET', wx.api.apiHost, 'media?action=videoCommentList', option, (data) => {
let back = data.data.code,
body = data.data
if (back == '1' || back == '4445') {
fn(body)
} else if (back == '5555') {
// wx.utils.alert('请登录后再访问', function() {
// wx.navigateTo({
// url: '/pages/login/login'
// })
// })
return
} else {
wx.utils.alert(body.msg)
}
})
},
videoComment: (option, fn) => {
wx.utils.getData('POST', wx.api.apiHost, 'media?action=videoComment', option, (data) => {
let back = data.data.code,
body = data.data
if (back == '1' || back == '4445') {
fn(body)
} else if (back == '5555') {
wx.utils.alert('请登录后再访问', function () {
wx.navigateTo({
url: '/pages/login/login'
})
})
return
} else {
wx.utils.alert(body.msg)
}
})
},
}
var isAttentClick = true //关注控制点击 1秒点一次
var isStarClick = true //点赞控制点击 1秒点一次
var isMoreContent = true //关注控制点击 1秒点一次
var isFirstInto = true //关注控制点击 1秒点一次
var isFirstPage = true //关注控制点击 1秒点一次
// pages/video/videoShop/videoShop.js
Page({
/**
* 页面的初始数据
*/
data: {
goods: true,
commentlist: [],
show: false,
commentShow: false,
videoInfo: '',
anchor_info: "",
is_follow: '',
star: '',
commentValue: '',
focus: false,
isCommentOwn: true,
p_comment_id: '',
secondList: '',
isMore: false,
secondIndex: '',
secondId: '',
myInfo: '',
page: 1,
firstPage: 1,
topNum: '',
pageCount: '',
firstPageCount: '',
toHeight: 0,
ownId: '',
thereId: '',
comment_num: '',
commentPeople: '',
selectName: '',
video_id:"",
commentScrollId:'',
inputShow:false,
statusBarHeight: '',
},
closeCommentShow() {
this.setData({
commentShow: false,
})
},
showCommentShow() {
this.setData({
commentShow: true
})
},
blurSecondInput() {
this.setData({
isCommentOwn: true,
})
},
viedeShows() {
// if (this.data.commentShow){
// this.setData({
// commentShow: false
// })
// }
},
showShare(){
this.setData({
show:true
})
},
nave() {
wx.navigateBack({
})
},
intoGoods(e) {
var goods_id = e.currentTarget.dataset.id,
user = wx.getStorageSync('userInfo'),
obj = {
scid: 0,
sid: 0,
g_id: goods_id
},
scene = user.uid + ',' + obj.g_id + ',' + obj.sid + ',' + obj.scid
let str = encodeURIComponent(scene)
// wx.navigateTo({
// url: '/pages/productDetail/productDetail?params=' + jsonObj
// })
wx.utils.toMiNis('wx6252d8212328fe00', '/pages/productDetail/productDetail?scene=' + str)
},
pageBack() {
var pages = getCurrentPages();
if (pages.length == 1) {
wx.reLaunch({
url: '/pages/video/videoIndex/videoIndex',
})
return
}
wx.navigateBack()
},
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var video_id = options.id,
this.setData({
video_id,
})
this.commentlist()
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
getCommentValue(e) {
this.setData({
commentValue: e.detail.value
})
},
// 二级评论获取index和id
replyInfo(e) {
this.setData({
focus: true,
isCommentOwn: false,
})
let id = e.currentTarget.dataset.id;
let name = e.currentTarget.dataset.name;
let index = e.currentTarget.dataset.idx
this.setData({
p_comment_id: id,
secondIndex: index,
commentPeople: '@' + name
})
},
//第一次一级评论 查看更多评论
getMoreComment(e) {
let id = e.currentTarget.dataset.id
let index = e.currentTarget.dataset.idx
isMoreContent = true
isFirstPage = false
this.data.page = 1
this.setData({
p_comment_id: id,
secondIndex: index
})
// this.data.commentlist[index].comment_num = this.data.commentlist[index].child_comment_num
this.data.commentlist[index].is_child_comment = false
this.commentSecondList()
},
// 下拉更多评论
onPullDown() {
if (this.data.firstPage < this.data.firstPageCount) {
isFirstInto = true
this.data.firstPage++
this.commentlist()
}
},
bindCommentOwn() {
this.setData({
isCommentOwn: true
})
},
// 获取一级列表
commentlist(id) {
let commentlist = this.data.commentlist
let userInfo = wx.getStorageSync('userInfo')
let params = {
uid: userInfo.uid,
video_id: this.data.video_id,
p_comment_id: 0,
page: this.data.firstPage,
sessionid: userInfo.sessionid
}
videoDetail.videoCommentList((params), (data) => {
console.log(data)
if (isFirstInto) {
commentlist = this.data.firstPage <= data.pageCount ? commentlist.concat(data.list) : commentlist
this.setData({
commentlist,
firstPageCount: data.pageCount,
})
} else {
commentlist = this.data.myInfo.concat(commentlist)
this.setData({
commentlist,
toHeight: 0,
})
}
})
},
getFocus(){
this.setData({
inputShow:true
})
},
// 二级列表获取更多
getSecondComment(e) {
if (this.data.page < this.data.pageCount) {
this.data.page++
let id = e.currentTarget.dataset.id
let index = e.currentTarget.dataset.idx
isMoreContent = true
this.setData({
p_comment_id: id,
secondIndex: index
})
this.commentSecondList()
}
},
/**
* isMoreContent && isFirstPage 有更多内容分页
* !isMoreContent && isFirstPage 评论二级内容
* !isMoreContent && isFirstPage 暂时无用
*/
commentSecondList() {
let index = this.data.secondIndex
let userInfo = wx.getStorageSync('userInfo')
let params = {
uid: userInfo.uid,
video_id: this.data.video_id,
p_comment_id: this.data.p_comment_id || 0,
page: this.data.page,
sessionid: userInfo.sessionid
}
videoDetail.videoCommentList((params), (data) => {
let list = data.list
let commentlist = this.data.commentlist
// console.log(index, list)
if (isMoreContent && isFirstPage) {
// commentlist[index].secondList = []
commentlist[index].secondList = this.data.page <= data.pageCount ? commentlist[index].secondList.concat(list) : commentlist[index].secondList;
commentlist[index].isMorePage = this.data.page < data.pageCount ? true : false
// commentlist[index].secondList = commentlist[index].secondList.concat(list)
} else if (!isMoreContent && isFirstPage) { //二级添加数据 isMorePage不刷新
commentlist[index].child_comment_num = Number(commentlist[index].child_comment_num) +1
commentlist[index].secondList = this.data.myInfo.concat(commentlist[index].secondList)
} else if (isMoreContent && !isFirstPage) {
commentlist[index].secondList = list
commentlist[index].isMorePage = this.data.page < data.pageCount ? true : false
}
isFirstPage = true
this.setData({
commentlist,
secondList: data.list,
p_comment_id: 0,
pageCount: data.pageCount,
})
})
},
loseSecondComment(e) {
let commentlist = this.data.commentlist
let id = e.currentTarget.dataset.id
let index = e.currentTarget.dataset.idx
commentlist[index].secondList = [];
// this.data.commentlist[index].child_comment_num = '更多'
this.data.commentlist[index].is_child_comment = true
this.setData({
commentlist,
commentScrollId:index
})
},
// 提交评论 p_comment_id 0 一级 不为0 二级
videoComment() {
let userInfo = wx.getStorageSync('userInfo')
let params = {
uid: userInfo.uid,
video_id: this.data.video_id,
content: this.data.commentValue || '',
p_comment_id: this.data.p_comment_id || 0,
sessionid: userInfo.sessionid
}
videoDetail.videoComment((params), (data) => {
var myInfo = [{
content: this.data.commentValue,
headimgurl: userInfo.shop.headimgurl,
addtime: '刚才',
nickname: userInfo.shop.nickname,
id: data.data.comment_id,
secondList: [],
child_comment_num:0,
}]
wx.showToast({
title: '发表成功',
})
console.log(this.data.p_comment_id)
if (!this.data.p_comment_id) {
isFirstInto = false
this.commentlist()
} else {
isMoreContent = false
this.commentSecondList()
}
this.setData({
comment_num: parseInt(this.data.comment_num) + 1,
commentValue: '',
p_comment_id: 0,
myInfo,
focus: false,
commentPeople: '献上你的一条热评',
isCommentOwn: true,
inputShow: false
})
})
},
closeMask(){
this.setData({
inputShow: false,
})
},
// 确认输入
confirmInput(e) {
if (e.currentTarget.dataset.id == 0) {
this.setData({
p_comment_id: 0,
isCommentOwn: true
})
} else {
this.setData({
isCommentOwn: false
})
}
if (!this.data.commentValue.trim()) {
wx.showToast({
title: '请输入内容',
icon: "none"
})
return
}
// console.log(this.data.commentValue.trim().split('').length)
// if (this.data.commentValue.trim().split('').length > 100){
// wx.showToast({
// title: `不能超过100字`,
// icon: "none"
// })
// return
// }
this.videoComment()
},
videoShop() {
let userInfo = wx.getStorageSync('userInfo')
let params = {
uid: userInfo.uid,
video_id: this.data.video_id,
sessionid: userInfo.sessionid
}
videoDetail.videoShow((params), (data) => {
console.log(data)
this.setData({
videoInfo: data.data,
comment_num: data.data.comment_num,
anchor_info: data.data.anchor_info,
is_follow: data.data.anchor_info.is_follow,
star: data.data.is_star,
ownId: userInfo.uid,
thereId: data.data.uid
})
})
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
console.log(this)
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
return {
title: this.data.videoInfo.title,
imageUrl: this.data.videoInfo.cover_url,
path: "/pages/video/videoShop/videoShop?id=" + this.data.video_id
}
}
})
css部分
page {
width: 100%;
height: 100%;
}
.video{
width: 100%;
height: 100%;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
.z_index{
z-index: 7;
}
.replywidth{
width: 500rpx;
word-break: break-all;
}
.secondValue{
position: absolute;
background: red;
width: 100%;
top: 0;
bottom: 0;
opacity: 0;
}
.video-logo-more{
width: 12rpx;
height: 10rpx;
}
.video-shop {
width: 100%;
height: 100%;
/* background: url('https://p6.suibianyuming.com.cn/1565167944sl073101zbbanner.png') no-repeat; */
/* background-size: 100% 100%; */
position: relative;
}
.video-shop-cate {
position: absolute;
right: 32rpx;
top: 600rpx;
}
.shop-item {
margin-top: 28rpx;
}
.shop-item image {
width: 64rpx;
height: 56rpx;
}
.shop-item-text {
font-size: 28rpx;
color: white;
font-weight: 500;
text-align: center;
}
.video-look-shop {
width: 306rpx;
height: 48rpx;
background: linear-gradient(45deg, rgba(33, 212, 253, 1) 0%, rgba(183, 33, 255, 1) 100%);
opacity: 1;
border-radius: 24rpx;
font-size: 24rpx;
color: white;
text-align: center;
line-height: 48rpx;
}
.video-look-shop image {
width: 28rpx;
height: 30rpx;
display: inline-block;
vertical-align: middle;
}
.item-info-zindex {
display: flex;
line-height: 80rpx;
margin-top: 24rpx;
}
.info-zindex-image {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 20rpx;
}
.goods-title {
color: white;
}
.goods-attent {
width: 102rpx;
height: 40rpx;
background: rgba(244, 103, 103, 1);
opacity: 1;
border-radius: 24rpx;
color: white;
font-size: 24rpx;
line-height: 40rpx;
margin: 20rpx 0rpx 0 20rpx;
}
.goods-attent image {
width: 100%;
height: 100%;
/* margin-left: 20rpx; */
}
.item-info-text {
color: white;
font-size: 28rpx;
margin-top: 24rpx;
}
.video-shop-info {
padding: 50rpx 32rpx;
position: absolute;
bottom: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.3) 100%);
}
.video-shop-cammera {
position: absolute;
right: 32rpx;
top: 160rpx;
padding-left: 100rpx;
}
.shop-cammars {
width: 40rpx;
height: 27rpx;
display: inline-block;
}
.shop-share-back{
margin-top: 10rpx;
width: 64rpx;
height: 64rpx;
background: rgba(0, 0, 0, 0.16);
border-radius: 50%;
opacity: 1;
display: flex;
text-align: center;
margin:0 30rpx;
justify-content: center;
align-items: center;
position: absolute;
top: 74rpx;
}
.shop-share-shandom {
width: 64rpx;
height: 64rpx;
background: rgba(0, 0, 0, 0.16);
border-radius: 50%;
opacity: 1;
display: flex;
text-align: center;
margin-left: 26rpx;
justify-content: center;
align-items: center;
}
.shop-share {
width: 33rpx;
height: 33rpx;
margin-top: 16rpx;
}
.video-attenet-shops {
color: #333;
font-size: 34rpx;
margin-bottom: 16rpx;
font-weight: 500;
}
.video-recommend-shops {
background: white;
padding: 24rpx 16rpx;
width: 650rpx;
background: rgba(255, 255, 255, 1);
opacity: 1;
border-radius: 20rpx;
position: absolute;
left: 3%;
transform: translateX(-50%);
bottom: 46rpx;
}
.attent-shop {
display: flex;
}
.attent-shop-img {
width: 164rpx;
height: 164rpx;
border-radius: 20rpx;
}
.back-icon {
width: 20rpx;
height: 33rpx;
}
.attent-shop-right {
margin-left: 24rpx;
padding-top: 10rpx;
}
.shop-right-title {
font-size: 28rpx;
color: #333;
width: 380rpx;
margin-bottom: 10rpx;
}
.shop-price {
color: #f46767;
font-size: 34rpx;
}
.shop-buy {
width: 148rpx;
height: 48rpx;
background: linear-gradient(44deg, rgba(33, 212, 253, 1) 0%, rgba(183, 33, 255, 1) 100%);
opacity: 1;
border-radius: 24rpx;
text-align: center;
line-height: 48rpx;
color: white;
font-size: 24rpx;
}
.shop-look-people {
font-size: 20rpx;
color: #999;
}
.shop-close {
width: 45rpx;
height: 45rpx;
position: absolute;
top: 14rpx;
right: 14rpx;
}
.video-share-bg {
width: 100%;
height: 388rpx;
background: url(https://p6.suibianyuming.com.cn/ct/video/shop/share-bg) no-repeat;
opacity: 0.99;
position: absolute;
bottom: 0;
z-index: 1;
}
.video-comment-bg {
width: 100%;
height: 822rpx;
background: url(https://p6.suibianyuming.com.cn/ct/video/shop/comment) no-repeat;
opacity: 0.96;
position: fixed;
bottom: 0;
z-index: 4;
}
.video-share-box {
width: 100%;
height: 388rpx;
position: absolute;
bottom: 0;
z-index: 3;
}
.video-border {
width: 686rpx;
height: 1px;
background: rgba(199, 199, 199, 1);
margin: 0 auto;
}
.video-share-close {
width: 45rpx;
height: 45rpx;
position: absolute;
top: 15rpx;
right: 15rpx;
}
.video-share-title {
text-align: center;
color: white;
font-size: 34rpx;
height: 90rpx;
line-height: 90rpx;
}
.viode-share-flex {
display: flex;
justify-content: space-around;
padding: 64rpx 116rpx;
text-align: center;
}
.viode-share-flex image {
width: 120rpx;
height: 120rpx;
}
.viode-share-flex view {
color: white;
font-size: 28rpx;
}
.video-comment-box {
width: 100%;
height: 822rpx;
position: absolute;
bottom: 0;
z-index: 4;
}
.comment-box-text {
font-size: 28rpx;
color: white;
height: 90rpx;
line-height: 90rpx;
padding-left: 32rpx;
}
.color-c7 {
color: #c7c7c7;
}
.comment-item-box1-l {
display: flex;
/* padding: 32rpx; */
}
.comment-item-right {
flex: 1
}
.comment-item-left {
width: 80rpx;
height: 80rpx;
border-radius: 50%;
margin-right: 16rpx;
}
.comment-name {
font-size: 24rpx;
color: #c7c7c7;
}
.comment-time {
font-size: 20rpx;
color: #c7c7c7;
}
.comment-comtent {
font-size: 28rpx;
color: white;
margin-top: 12rpx;
position: relative;
width: 500rpx;
}
.comment-s-box-list {
width: 566rpx;
height: auto;
float: right;
margin-top: 10rpx;
border-radius: 20rpx;
background: rgba(116, 116, 116, 0.3);
/* padding-bottom: 12rpx; */
}
.comment-item-box-s {
/* height:196rpx; */
display: flex;
padding: 16rpx 24rpx;
}
.comment-item-left-s {
width: 50rpx;
height: 50rpx;
border-radius: 50%;
margin-right: 8rpx;
}
.comment-box {
padding: 32rpx;
box-sizing: border-box;
}
.scroll-box {
width: 100%;
white-space: nowrap;
}
.comment-item-right-s {
flex: 1;
}
.comment-name-s {
font-size: 20rpx;
color: #999;
/* margin-top: 10rpx; */
}
.comment-comtent-s {
color: white;
font-size: 24rpx;
margin-top: 12rpx;
word-break: break-all;
}
.comment-list {
position: relative;
width: 100%;
margin-bottom: 18rpx;
}
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.view-shop-input {
width: 100%;
height: 86rpx;
background: rgba(0, 0, 0, 0.5);
position: fixed;
bottom: 0;
z-index: 11;
}
.view-shop-input image {
width: 46rpx;
height: 44rpx;
position: absolute;
top: 22rpx;
left: 56rpx;
}
.view-shop-input input {
width: 686rpx;
height: 68rpx;
background: rgba(44, 43, 42, 1);
border-radius: 40rpx;
margin: 10rpx auto;
padding-left: 78rpx;
box-sizing: border-box;
font-size: 28rpx;
color: #999;
}
.comment-more {
font-size: 22rpx;
color: #999;
margin-top: 12rpx;
margin-left: -44rpx;
}
.comment-more-small{
font-size: 22rpx;
color: #999;
margin-left: 34rpx;
margin-bottom: 12rpx;
}
.button-sahre{
margin: 0;
line-height: 0;
background: transparent;
margin-bottom: 10rpx;
border: 0;
position: static;
}
@-webkit-keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
.bounce {
-webkit-animation-name: bounce;
animation-name: bounce;
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
}
.animated {
-webkit-animation-duration: 1s;
animation-duration: 1s;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.animated.delay-1s {
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
button::after {
border: none;
width: 0;
height: 0;
}
@keyframes bounce {
from,
20%,
53%,
80%,
to {
-webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
40%,
43% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -30px, 0);
transform: translate3d(0, -30px, 0);
}
70% {
-webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
-webkit-transform: translate3d(0, -15px, 0);
transform: translate3d(0, -15px, 0);
}
90% {
-webkit-transform: translate3d(0, -4px, 0);
transform: translate3d(0, -4px, 0);
}
}
比较多也比较乱，把模拟数据对好 接口对好。复制过去，应该就可以用了。比较乱
如果有不懂的。有小程序兴趣.疑难.接小程序 h5兼职. 可以加QQ一起交流 978744151
1817
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
