PositionTransform模块间位置切换

author: 闫申申

定义

模块间位置相互切换。

图片展示

PositionTransform 模块间位置切换 - 图1

代码演示

  2. import Anime from 'pile/dist/components/anime'
  3. const {PositionTransform} = Anime
  5. <PositionTransform
  6.   ref="myPostionSwitch"
  7.   orderArr={[1,2,3,4]}
  8.   itemsMoveBack={function(n){console.log(n)}}
  9. >
  10.   <div className="pile-demo-postion-test">1</div>
  11.   <div className="pile-demo-postion-test">2</div>
  12.   <div className="pile-demo-postion-test">3</div>
  13.   <div className="pile-demo-postion-test">4</div>
  14. </PositionTransform>

属性

参数 描述 数据类型 默认值
width 子元素移动的单位宽度 number 80
orderArr 子元素排列的数组（数组个数需与自元素的个数一致） array [1,2,3,4]
itemsMoveBack 自元素位置移动后的回调 function

点击查看详细参数说明

原文: https://didi.github.io/pile.js/docs/2017/08/develop-components-anime-positiontransform.html