thank you for 2.2.0
<template>
<div class="page">
<div class="navbar">
<div class="navbar-inner sliding">
<div class="title">List Index</div>
</div>
</div>
<div class="list-index"></div>
<div class="page-content">
<div class="list simple-list">
<ul>
{{#list}}
<li><span>{{this}}</span></li>
{{/list}}
</ul>
</div>
</div>
</div>
</template>
<script>
return{
data:function(){
return {
list:(
'Aaron Adam Aiden Albert Alex Alexander Alfie Archie Arthur Austin'+
'Benjamin Blake Bobby Caleb Callum Cameron Charles Charlie Connor'+
'Daniel David Dexter Dylan Edward Elijah Elliot Elliott Ethan Evan'+
'Felix Finlay Finley Frankie Freddie Frederick Gabriel George'+
'Harley Harrison Harry Harvey Henry Hugo Ibrahim Isaac'+
'Jack Jacob Jake James Jamie Jayden Jenson Joseph Joshua Jude'+
'Kai Kian Leo Leon Lewis Liam Logan Louie Louis Luca Lucas Luke'+
'Mason Matthew Max Michael Mohammad Mohammed Muhammad Nathan Noah'+
'Oliver Ollie Oscar Owen Reuben Riley Robert Ronnie Rory Ryan'+
'Samuel Sebastian Seth Sonny Stanley Teddy Theo Theodore Thomas'+
'Toby Tommy Tyler William Zachary'
).split(' ')
};
},
methods:{
getIndexes:function(list){
return list.map(function(v){return v.charAt(0).toUpperCase()})
.filter(function(v,i,t){return t.indexOf(v)===i});
},
doSelect:function(l,k,i){
var els=l.$listEl.find('li');
for(var i=0;i<els.length;i++){
if(Dom7(els[i]).text().charAt(0).toUpperCase()==k){
l.$pageContentEl.scrollTop(
(Dom7(els[i]).offset().top+l.$pageContentEl[0].scrollTop)-
parseInt(l.$pageContentEl.css('padding-top'),10)
);
break;
}
}
}
},
on:{
pageBeforeRemove(e,page){
this.listIndex.destroy();
},
pageInit:function(e,page){
var self=this;
self.listIndex=app.listIndex.create({
listEl:self.$el.find('.list'),
el:self.$el.find('.list-index'),
indexes:self.getIndexes(self.list),
scrollList:false,
label:true,
on:{
select:function(l,k,i){
self.doSelect(l,k,i);
}
}
});
}
}
}
</script>