import listanim from 'listanim';
//创建对象
let method = new listanim.LA();
//初始化配置
method.init({
container: 'listContainer', //容器id
data: [ //列表显示所有数据
["数据", "篮球", "排球", "Ⅱ"],
["自行车", "三轮车", "电动车", "排球"],
["铁路", "公路", "羊肠小道", "排球"],
["ssss", "sss", "sssss", "排球"],
["dddd", "dddd", "dddddd", "排球"],
["ffff", "fff", "ggggg", "排球"]
],
animateTo: { //动画终点样式
height: 50 + "px",
lineHeight: 50 + "px"
},
liStyle: { //li元素的css样式
height: 'auto',
padding: '10px 0',
borderBottom: '1px dashed #001A35',
backgroundColor: '#76B9ED',
display: 'flex',
},
content: [{ //li元素中div的样式 flex代表宽度占比 高度自适应
text: '测试',
flex: 2,
style: {
padding:'1',
margin: '0px',
backgroundColor: 'red'
}
},
{
text: '测试1',
flex: 1,
style: {
// padding:'1px',
margin: '0px',
backgroundColor: 'green'
}
},
{
text: '测试2',
flex: 1,
style: {
// padding:'1px',
margin: '0px',
backgroundColor: 'white|black|grey|pink' //多个色彩与数据对应
}
}
,
{
text: 'Ⅱ',
flex: 0.3,
style: {
padding:'1px',
margin: '10px',
backgroundColor: 'yellow',
borderRadius:'10px'
}
}
],
nextTime: 2000, //单条动画间隔时间
animateTime:100, //动画长度
animateKind: 'animated flipInX', //动画
sqlkey: 'OBJECTID', //查询字段
sqlvals:[ //查询内容集合
1,2,3,4,5,6,7,8,9,0,332,110,12
]
},
function(param){
//回调sql参数
});
listanim
1.1.2 • Public • PublishedPackage Sidebar
Install
npm i listanim
Weekly Downloads
1
Version
1.1.2
License
ISC
Unpacked Size
9.56 kB
Total Files
4