首页下载资源前端支付宝小程序商品加入购物车动画 2020年的代码不知道还能不能用

ZIP支付宝小程序商品加入购物车动画 2020年的代码不知道还能不能用

men_gqi1.82KB需要积分:1

资源文件列表:

flyCart.zip 大约有5个文件
  1. flyCart/
  2. flyCart/flyCart.json 87B
  3. flyCart/flyCart.js 1.44KB
  4. flyCart/flyCart.acss
  5. flyCart/flyCart.axml 536B

资源介绍:

支付宝小程序商品加入购物车动画 2020年的代码不知道还能不能用
Component({ mixins: [], data: { position: [] }, props: {//接收父组件传的值 tran: {//1小球纵向移动距离//0小球横向移动距离//2//购物车宽度 type: Array, value: [] }, show: { type: Boolean, value: true }, position: {//小球初始位置,也就是点击位置0为x,1为y type: Array, value: [] }, }, didMount() { this.animation = my.createAnimation({ transformOrigin: "left bottom 0", duration: 800,//动画持续时间 timeFunction: "ease-in",//定义动画效果 }) this.animationBox = my.createAnimation({ transformOrigin: "left bottom 0", duration: 800,//动画持续时间 timeFunction: "ease",//定义动画效果 delay: 1, }) }, didUpdate() { }, didUnmount() { }, methods: { init() { let that = this let position = [this.props.position[0], this.props.position[1]] this.setData({ position, }, () => { //动画开始 setTimeout(function () { that.animation.translate(0, Math.abs(that.props.tran[1])).step()//小球垂直变速运动 that.setData({ animation: that.animation.export() }) }, 20) this.animationBox.translate(-Math.abs(this.props.tran[0] - this.props.tran[2] / 2), 0).step()//盒子匀速平移运动 this.setData({ animationBox: this.animationBox.export() }) }) } }, });
100+评论
captcha