我们有一个带有一些条目的 ListView(在我们的测试用例中为 205 个条目),当您快速滚动列表时,JS 线程 fps 有时会从 60 下降到大约 20,然后 TouchableOpacity 元素将变得无响应(就像所有其他 React 元素一样)。UI 线程 fps 保持在 60 并在列表中滚动仍然可能,但 Touchable 需要一些时间才能再次响应。
看起来 react 正在为事件创建某种队列,并且滚动会向其中添加事件,而 Touchable 上的触摸事件必须等待所有其他“不重要”事件得到处理。
我们正在使用 React 版本 15.4.2 和 React-Native 版本 0.40.0。
我们可以在 LG Nexus 5X 和三星 Note 4 上几乎不断地重现该问题,但不幸的是,模拟器中没有(x86 似乎跑得快而手臂慢了)。
这是我们可以重现问题的测试组件。
import * as React from 'react';
import {View, Text, TouchableOpacity, ListView} from 'react-native';
export const SPACING = {
TINY: 4,
SMALLER: 8,
SMALL: 12,
BASE: 16,
LARGE: 24,
XLARGE: 32,
XXLARGE: 48
};
export const DEFAULT_COLORS = {
'Accent': '#AF8DE9',
'NaviBg': '#28222D',
'SecondaryContainer': '#574c68',
'SecondaryContainerHeader': '#41384e',
'Header': '#F5F5F5', // should be #fcfcfc but doesn't work with react-native!???
'Tabs': '#FCFCFC',
'Handle': '#AF8DE9',
'Content': '#FFFFFF',
'Primary': '#D6AFEB',
'Green': '#72D2B4',
'Red': '#E68585',
'Yellow': '#FABC74',
'Male': '#9EC6E6',
'Female': '#EDACC9',
'Darker': '#3F3F3F',
'Dark': '#5C5C5C',
'Normal': '#757575',
'Light': '#949494',
'Lighter': '#C2C2C2',
'LineDivider': '#f3f1f6'
};
const data = '{"Flirt":[{"key":"FLIRT.Flirt","channel":{"channelName":"Flirt","channelMetadata":{"userCount":54}}},{"key":"FLIRT.Ladies only","channel":{"channelName":"Ladies only","channelMetadata":{"userCount":45}}},{"key":"FLIRT.Psssst","channel":{"channelName":"Psssst","channelMetadata":{"userCount":68}}},{"key":"FLIRT.Singles 15-17","channel":{"channelName":"Singles 15-17","channelMetadata":{"userCount":48}}},{"key":"FLIRT.Flirt Private","channel":{"channelName":"Flirt Private","channelMetadata":{"userCount":63}}},{"key":"FLIRT.Flirt 18+","channel":{"channelName":"Flirt 18+","channelMetadata":{"userCount":35}}},{"key":"FLIRT.Flirt 30+","channel":{"channelName":"Flirt 30+","channelMetadata":{"userCount":39}}},{"key":"FLIRT.Videoflirt","channel":{"channelName":"Videoflirt","channelMetadata":{"userCount":22}}},{"key":"FLIRT.Private 23+","channel":{"channelName":"Private 23+","channelMetadata":{"userCount":47}}},{"key":"FLIRT.Suche","channel":{"channelName":"Suche","channelMetadata":{"userCount":43}}}],"Classic":[{"key":"CLASSIC.Nostalgie","channel":{"channelName":"Nostalgie","channelMetadata":{"userCount":4}}},{"key":"CLASSIC.Kiss","channel":{"channelName":"Kiss","channelMetadata":{"userCount":6}}},{"key":"CLASSIC.Welcome!","channel":{"channelName":"Welcome!","channelMetadata":{"userCount":3}}},{"key":"CLASSIC.Family","channel":{"channelName":"Family","channelMetadata":{"userCount":1}}},{"key":"CLASSIC.Knuddels","channel":{"channelName":"Knuddels","channelMetadata":{"userCount":2}}},{"key":"CLASSIC.Classic","channel":{"channelName":"Classic","channelMetadata":{"userCount":1}}},{"key":"CLASSIC.Stammis","channel":{"channelName":"Stammis","channelMetadata":{"userCount":1}}},{"key":"CLASSIC.Mix Classic","channel":{"channelName":"Mix Classic","channelMetadata":{"userCount":1}}},{"key":"CLASSIC.Neustammis","channel":{"channelName":"Neustammis","channelMetadata":{"userCount":1}}},{"key":"CLASSIC.CMs","channel":{"channelName":"CMs","channelMetadata":{"userCount":1}}}],"Spiele":[{"key":"GAMES.Mafia2 Party","channel":{"channelName":"Mafia2 Party","channelMetadata":{"userCount":26}}},{"key":"GAMES.8-Ball","channel":{"channelName":"8-Ball","channelMetadata":{"userCount":19}}},{"key":"GAMES.Mafia2 Vampir","channel":{"channelName":"Mafia2 Vampir","channelMetadata":{"userCount":14}}},{"key":"GAMES.MauMau Kurzturnier Anmeldung","channel":{"channelName":"MauMau Kurzturnier Anmeldung","channelMetadata":{"userCount":14}}},{"key":"GAMES.Fifty! Free","channel":{"channelName":"Fifty! Free","channelMetadata":{"userCount":11}}},{"key":"GAMES.FotoContest Mixed","channel":{"channelName":"FotoContest Mixed","channelMetadata":{"userCount":6}}},{"key":"GAMES.MauMauX 6max","channel":{"channelName":"MauMauX 6max","channelMetadata":{"userCount":6}}},{"key":"GAMES.Poker Knuddels Freeroll","channel":{"channelName":"Poker Knuddels Freeroll","channelMetadata":{"userCount":9}}},{"key":"GAMES.Poker Stundenfinale","channel":{"channelName":"Poker Stundenfinale","channelMetadata":{"userCount":9}}},{"key":"GAMES.SmileyWars","channel":{"channelName":"SmileyWars","channelMetadata":{"userCount":4}}}],"Kartenspiele":[{"key":"CARDGAMES.MauMau Kurzturnier","channel":{"channelName":"MauMau Kurzturnier","channelMetadata":{"userCount":1}}},{"key":"CARDGAMES.Poker Tourneys Stundenfinale","channel":{"channelName":"Poker Tourneys Stundenfinale","channelMetadata":{"userCount":1}}},{"key":"CARDGAMES.MauMau Kurzturnier Anmeldung","channel":{"channelName":"MauMau Kurzturnier Anmeldung","channelMetadata":{"userCount":14}}},{"key":"CARDGAMES.Poker Tourneys","channel":{"channelName":"Poker Tourneys","channelMetadata":{"userCount":1}}},{"key":"CARDGAMES.MauMauX 6max","channel":{"channelName":"MauMauX 6max","channelMetadata":{"userCount":6}}},{"key":"CARDGAMES.Poker Knuddels Freeroll","channel":{"channelName":"Poker Knuddels Freeroll","channelMetadata":{"userCount":9}}},{"key":"CARDGAMES.Poker Stundenfinale","channel":{"channelName":"Poker Stundenfinale","channelMetadata":{"userCount":9}}},{"key":"CA' +
'RDGAMES.Poker 2Kn","channel":{"channelName":"Poker 2Kn","channelMetadata":{"userCount":9}}},{"key":"CARDGAMES.Poker Lobby","channel":{"channelName":"Poker Lobby","channelMetadata":{"userCount":6}}},{"key":"CARDGAMES.Poker 50Kn","channel":{"channelName":"Poker 50Kn","channelMetadata":{"userCount":7}}}],"Lokalrunde":[{"key":"LOKALRUNDE.Karlsruhe","channel":{"channelName":"Karlsruhe","channelMetadata":{"userCount":11}}},{"key":"LOKALRUNDE.Mannheim","channel":{"channelName":"Mannheim","channelMetadata":{"userCount":31}}},{"key":"LOKALRUNDE.Freiburg","channel":{"channelName":"Freiburg","channelMetadata":{"userCount":13}}},{"key":"LOKALRUNDE.BaWü 40+","channel":{"channelName":"BaWü 40+","channelMetadata":{"userCount":11}}},{"key":"LOKALRUNDE.Hamburg","channel":{"channelName":"Hamburg","channelMetadata":{"userCount":43}}},{"key":"LOKALRUNDE.Berlin","channel":{"channelName":"Berlin","channelMetadata":{"userCount":35}}},{"key":"LOKALRUNDE.Bremen","channel":{"channelName":"Bremen","channelMetadata":{"userCount":38}}},{"key":"LOKALRUNDE.Dortmund","channel":{"channelName":"Dortmund","channelMetadata":{"userCount":33}}},{"key":"LOKALRUNDE.Essen","channel":{"channelName":"Essen","channelMetadata":{"userCount":28}}},{"key":"LOKALRUNDE.Köln","channel":{"channelName":"Köln","channelMetadata":{"userCount":28}}}],"Musik":[{"key":"MUSIC.Emo","channel":{"channelName":"Emo","channelMetadata":{"userCount":25}}},{"key":"MUSIC.Alternative","channel":{"channelName":"Alternative","channelMetadata":{"userCount":17}}},{"key":"MUSIC.Hip Hop","channel":{"channelName":"Hip Hop","channelMetadata":{"userCount":15}}},{"key":"MUSIC.Gothic","channel":{"channelName":"Gothic","channelMetadata":{"userCount":10}}},{"key":"MUSIC.Metal","channel":{"channelName":"Metal","channelMetadata":{"userCount":3}}},{"key":"MUSIC.Punk","channel":{"channelName":"Punk","channelMetadata":{"userCount":3}}},{"key":"MUSIC./Sunshine Live","channel":{"channelName":"/Sunshine Live","channelMetadata":{"userCount":3}}},{"key":"MUSIC.Techno","channel":{"channelName":"Techno","channelMetadata":{"userCount":1}}},{"key":"MUSIC.Rap","channel":{"channelName":"Rap","channelMetadata":{"userCount":2}}},{"key":"MUSIC.RnB","channel":{"channelName":"RnB","channelMetadata":{"userCount":1}}}],"Nutzerchannel":[{"key":"MYCHANNELS./Sidoh","channel":{"channelName":"/Sidoh","channelMetadata":{"userCount":34}}},{"key":"MYCHANNELS./DiceOne","channel":{"channelName":"/DiceOne","channelMetadata":{"userCount":27}}},{"key":"MYCHANNELS./Multigame","channel":{"channelName":"/Multigame","channelMetadata":{"userCount":14}}},{"key":"MYCHANNELS./ParaDICE","channel":{"channelName":"/ParaDICE","channelMetadata":{"userCount":14}}},{"key":"MYCHANNELS./Kissecke","channel":{"channelName":"/Kissecke","channelMetadata":{"userCount":8}}},{"key":"MYCHANNELS./Knuddels Area DeLuXe","channel":{"channelName":"/Knuddels Area DeLuXe","channelMetadata":{"userCount":7}}},{"key":"MYCHANNELS./Endless Video","channel":{"channelName":"/Endless Video","channelMetadata":{"userCount":4}}},{"key":"MYCHANNELS./TigerDice","channel":{"channelName":"/TigerDice","channelMetadata":{"userCount":9}}},{"key":"MYCHANNELS./Luk<3s","channel":{"channelName":"/Luk<3s","channelMetadata":{"userCount":4}}},{"key":"MYCHANNELS./Elite-Dice","channel":{"channelName":"/Elite-Dice","channelMetadata":{"userCount":6}}}],"Über 20":[{"key":"OVER20.Mamas&Papas","channel":{"channelName":"Mamas&Papas","channelMetadata":{"userCount":38}}},{"key":"OVER20.Flirt 18+","channel":{"channelName":"Flirt 18+","channelMetadata":{"userCount":35}}},{"key":"OVER20.Flirt 30+","channel":{"channelName":"Flirt 30+","channelMetadata":{"userCount":39}}},{"key":"OVER20.Private 23+","channel":{"channelName":"Private 23+","channelMetadata":{"userCount":47}}},{"key":"OVER20.Private","channel":{"channelName":"Private","channelMetadata":{"userCount":62}}},{"key":"OVER20.Suche","channel":{"channelName":"Suche","channelMetadata":{"userCount":43}}},{"key":"OVER20.Flirt 65+","channel":{"channelName":"Flirt' +
' 65+","channelMetadata":{"userCount":40}}},{"key":"OVER20.Flirt 35+","channel":{"channelName":"Flirt 35+","channelMetadata":{"userCount":41}}},{"key":"OVER20.Flirt 60+","channel":{"channelName":"Flirt 60+","channelMetadata":{"userCount":33}}},{"key":"OVER20.Flirt 40+","channel":{"channelName":"Flirt 40+","channelMetadata":{"userCount":36}}}],"Sport":[{"key":"SPORT.Fußball","channel":{"channelName":"Fußball","channelMetadata":{"userCount":2}}},{"key":"SPORT.Basketball","channel":{"channelName":"Basketball","channelMetadata":{"userCount":2}}},{"key":"SPORT./1895","channel":{"channelName":"/1895","channelMetadata":{"userCount":3}}},{"key":"SPORT.Frankfurt Fußball","channel":{"channelName":"Frankfurt Fußball","channelMetadata":{"userCount":2}}},{"key":"SPORT.Volleyball","channel":{"channelName":"Volleyball","channelMetadata":{"userCount":1}}},{"key":"SPORT.Biker","channel":{"channelName":"Biker","channelMetadata":{"userCount":1}}},{"key":"SPORT.Eishockey","channel":{"channelName":"Eishockey","channelMetadata":{"userCount":1}}},{"key":"SPORT.München Fußball","channel":{"channelName":"München Fußball","channelMetadata":{"userCount":1}}},{"key":"SPORT.Cars","channel":{"channelName":"Cars","channelMetadata":{"userCount":2}}},{"key":"SPORT.Handball","channel":{"channelName":"Handball","channelMetadata":{"userCount":1}}}],"Thementalk":[{"key":"THEMETALK.Coming Out","channel":{"channelName":"Coming Out","channelMetadata":{"userCount":34}}},{"key":"THEMETALK.Emo","channel":{"channelName":"Emo","channelMetadata":{"userCount":25}}},{"key":"THEMETALK.Alternative","channel":{"channelName":"Alternative","channelMetadata":{"userCount":17}}},{"key":"THEMETALK.Hip Hop","channel":{"channelName":"Hip Hop","channelMetadata":{"userCount":15}}},{"key":"THEMETALK.Gothic","channel":{"channelName":"Gothic","channelMetadata":{"userCount":10}}},{"key":"THEMETALK.Rollenspiele","channel":{"channelName":"Rollenspiele","channelMetadata":{"userCount":11}}},{"key":"THEMETALK.Bruchtal","channel":{"channelName":"Bruchtal","channelMetadata":{"userCount":5}}},{"key":"THEMETALK.Mobile Flirt","channel":{"channelName":"Mobile Flirt","channelMetadata":{"userCount":8}}},{"key":"THEMETALK.Mobile Talk","channel":{"channelName":"Mobile Talk","channelMetadata":{"userCount":7}}},{"key":"THEMETALK.Manga & Anime","channel":{"channelName":"Manga & Anime","channelMetadata":{"userCount":4}}}],"Unter 18":[{"key":"UNDER18.Singles 15-17","channel":{"channelName":"Singles 15-17","channelMetadata":{"userCount":48}}},{"key":"UNDER18.Kunterbunt","channel":{"channelName":"Kunterbunt","channelMetadata":{"userCount":29}}},{"key":"UNDER18.Private 15-17","channel":{"channelName":"Private 15-17","channelMetadata":{"userCount":10}}},{"key":"UNDER18.Friends","channel":{"channelName":"Friends","channelMetadata":{"userCount":7}}},{"key":"UNDER18.Flirt 16+","channel":{"channelName":"Flirt 16+","channelMetadata":{"userCount":4}}},{"key":"UNDER18.Kuschelecke","channel":{"channelName":"Kuschelecke","channelMetadata":{"userCount":2}}},{"key":"UNDER18.Friends 15-17","channel":{"channelName":"Friends 15-17","channelMetadata":{"userCount":1}}},{"key":"UNDER18.Teenflirt","channel":{"channelName":"Teenflirt","channelMetadata":{"userCount":1}}},{"key":"UNDER18.Love","channel":{"channelName":"Love","channelMetadata":{"userCount":1}}},{"key":"UNDER18.After School","channel":{"channelName":"After School","channelMetadata":{"userCount":1}}}],"Spaß":[{"key":"FUN.Lokschuppen","channel":{"channelName":"Lokschuppen","channelMetadata":{"userCount":6}}},{"key":"FUN./Video what ever x3","channel":{"channelName":"/Video what ever x3","channelMetadata":{"userCount":6}}},{"key":"FUN.Chinatown","channel":{"channelName":"Chinatown","channelMetadata":{"userCount":2}}},{"key":"FUN.Welcome!","channel":{"channelName":"Welcome!","channelMetadata":{"userCount":3}}},{"key":"FUN./DiceChampion2","channel":{"channelName":"/DiceChampion2","channelMetadata":{"userCount":1}}},{"key":"FUN.Irrenhaus","channel":{"channelName":"Irrenhaus","' +
'channelMetadata":{"userCount":1}}},{"key":"FUN.Pferdegeflüster","channel":{"channelName":"Pferdegeflüster","channelMetadata":{"userCount":1}}},{"key":"FUN.Kekse","channel":{"channelName":"Kekse","channelMetadata":{"userCount":1}}},{"key":"FUN./Chillerbox","channel":{"channelName":"/Chillerbox","channelMetadata":{"userCount":1}}},{"key":"FUN.0-8-15","channel":{"channelName":"0-8-15","channelMetadata":{"userCount":1}}}],"Liebe":[{"key":"LOVE.Coming Out","channel":{"channelName":"Coming Out","channelMetadata":{"userCount":34}}},{"key":"LOVE.Liebeskummer","channel":{"channelName":"Liebeskummer","channelMetadata":{"userCount":1}}},{"key":"LOVE.Herzschmerz","channel":{"channelName":"Herzschmerz","channelMetadata":{"userCount":1}}},{"key":"LOVE.Liebe","channel":{"channelName":"Liebe","channelMetadata":{"userCount":1}}},{"key":"LOVE./Betreten auf eigene Gefahr","channel":{"channelName":"/Betreten auf eigene Gefahr","channelMetadata":{"userCount":1}}},{"key":"LOVE./shut up","channel":{"channelName":"/shut up","channelMetadata":{"userCount":1}}},{"key":"LOVE./Hollywoodliebe","channel":{"channelName":"/Hollywoodliebe","channelMetadata":{"userCount":1}}},{"key":"LOVE./Ein Hoch auf Uns","channel":{"channelName":"/Ein Hoch auf Uns","channelMetadata":{"userCount":1}}},{"key":"LOVE./kisshall","channel":{"channelName":"/kisshall","channelMetadata":{"userCount":1}}},{"key":"LOVE./Sternmensch","channel":{"channelName":"/Sternmensch","channelMetadata":{"userCount":1}}}],"Schule & Beruf":[{"key":"JOB./Web-Dev","channel":{"channelName":"/Web-Dev","channelMetadata":{"userCount":2}}},{"key":"JOB.Hausaufgaben","channel":{"channelName":"Hausaufgaben","channelMetadata":{"userCount":1}}},{"key":"JOB.Kaffeepause","channel":{"channelName":"Kaffeepause","channelMetadata":{"userCount":5}}},{"key":"JOB.Campus","channel":{"channelName":"Campus","channelMetadata":{"userCount":1}}},{"key":"JOB.Hitzefrei","channel":{"channelName":"Hitzefrei","channelMetadata":{"userCount":1}}},{"key":"JOB./Hausaufgaben Video","channel":{"channelName":"/Hausaufgaben Video","channelMetadata":{"userCount":1}}}],"Fantasie":[{"key":"PHANTASY.Rollenspiele","channel":{"channelName":"Rollenspiele","channelMetadata":{"userCount":11}}},{"key":"PHANTASY.Bruchtal","channel":{"channelName":"Bruchtal","channelMetadata":{"userCount":5}}},{"key":"PHANTASY.Manga & Anime","channel":{"channelName":"Manga & Anime","channelMetadata":{"userCount":4}}},{"key":"PHANTASY.Vampire","channel":{"channelName":"Vampire","channelMetadata":{"userCount":3}}},{"key":"PHANTASY.Magic","channel":{"channelName":"Magic","channelMetadata":{"userCount":2}}},{"key":"PHANTASY.Nirvana","channel":{"channelName":"Nirvana","channelMetadata":{"userCount":1}}},{"key":"PHANTASY./Schneezone","channel":{"channelName":"/Schneezone","channelMetadata":{"userCount":1}}},{"key":"PHANTASY./Einhornwinterwonderland","channel":{"channelName":"/Einhornwinterwonderland","channelMetadata":{"userCount":1}}},{"key":"PHANTASY./only god forgives","channel":{"channelName":"/only god forgives","channelMetadata":{"userCount":1}}},{"key":"PHANTASY./Gedöns","channel":{"channelName":"/Gedöns","channelMetadata":{"userCount":1}}}],"Unterhaltung":[{"key":"ENTERTAINMENT.Video Chill-Out","channel":{"channelName":"Video Chill-Out","channelMetadata":{"userCount":11}}},{"key":"ENTERTAINMENT.Mobile Flirt","channel":{"channelName":"Mobile Flirt","channelMetadata":{"userCount":8}}},{"key":"ENTERTAINMENT.Mobile Talk","channel":{"channelName":"Mobile Talk","channelMetadata":{"userCount":7}}},{"key":"ENTERTAINMENT.Computer Talk","channel":{"channelName":"Computer Talk","channelMetadata":{"userCount":3}}},{"key":"ENTERTAINMENT./Vegas Dice","channel":{"channelName":"/Vegas Dice","channelMetadata":{"userCount":3}}},{"key":"ENTERTAINMENT./Russia","channel":{"channelName":"/Russia","channelMetadata":{"userCount":2}}},{"key":"ENTERTAINMENT.Mode","channel":{"channelName":"Mode","channelMetadata":{"userCount":3}}},{"key":"ENTERTAINMENT./Strawberries","channel":{"channelName"' +
':"/Strawberries","channelMetadata":{"userCount":3}}},{"key":"ENTERTAINMENT.Videogames","channel":{"channelName":"Videogames","channelMetadata":{"userCount":1}}},{"key":"ENTERTAINMENT.Video Party","channel":{"channelName":"Video Party","channelMetadata":{"userCount":1}}}],"Freizeit":[{"key":"HOBBY.Plauderecke","channel":{"channelName":"Plauderecke","channelMetadata":{"userCount":6}}},{"key":"HOBBY./Video Denny","channel":{"channelName":"/Video Denny","channelMetadata":{"userCount":1}}},{"key":"HOBBY./Lion49","channel":{"channelName":"/Lion49","channelMetadata":{"userCount":3}}},{"key":"HOBBY.Biergarten","channel":{"channelName":"Biergarten","channelMetadata":{"userCount":2}}},{"key":"HOBBY./what ever x3","channel":{"channelName":"/what ever x3","channelMetadata":{"userCount":1}}},{"key":"HOBBY.Forumstreff","channel":{"channelName":"Forumstreff","channelMetadata":{"userCount":1}}},{"key":"HOBBY.Party","channel":{"channelName":"Party","channelMetadata":{"userCount":1}}},{"key":"HOBBY.Weihnachtsmarkt","channel":{"channelName":"Weihnachtsmarkt","channelMetadata":{"userCount":2}}},{"key":"HOBBY.Chattertreffen","channel":{"channelName":"Chattertreffen","channelMetadata":{"userCount":1}}},{"key":"HOBBY./Italien","channel":{"channelName":"/Italien","channelMetadata":{"userCount":1}}}],"Videochat":[{"key":"VIDEOCHAT.Videoflirt","channel":{"channelName":"Videoflirt","channelMetadata":{"userCount":22}}},{"key":"VIDEOCHAT.Video Chill-Out","channel":{"channelName":"Video Chill-Out","channelMetadata":{"userCount":11}}},{"key":"VIDEOCHAT./Knuddels Area DeLuXe","channel":{"channelName":"/Knuddels Area DeLuXe","channelMetadata":{"userCount":7}}},{"key":"VIDEOCHAT./Endless Video","channel":{"channelName":"/Endless Video","channelMetadata":{"userCount":4}}},{"key":"VIDEOCHAT./Video what ever x3","channel":{"channelName":"/Video what ever x3","channelMetadata":{"userCount":6}}},{"key":"VIDEOCHAT./die lockererunde","channel":{"channelName":"/die lockererunde","channelMetadata":{"userCount":3}}},{"key":"VIDEOCHAT./Vegas Dice","channel":{"channelName":"/Vegas Dice","channelMetadata":{"userCount":3}}},{"key":"VIDEOCHAT./Frankfurt Video","channel":{"channelName":"/Frankfurt Video","channelMetadata":{"userCount":2}}},{"key":"VIDEOCHAT./Yanx","channel":{"channelName":"/Yanx","channelMetadata":{"userCount":3}}},{"key":"VIDEOCHAT./AdventureTime","channel":{"channelName":"/AdventureTime","channelMetadata":{"userCount":2}}}],"Channels mit Apps":[{"key":"APPCHANNELS./DiceOne","channel":{"channelName":"/DiceOne","channelMetadata":{"userCount":27}}},{"key":"APPCHANNELS./Multigame","channel":{"channelName":"/Multigame","channelMetadata":{"userCount":14}}},{"key":"APPCHANNELS./Braintainment","channel":{"channelName":"/Braintainment","channelMetadata":{"userCount":3}}},{"key":"APPCHANNELS./777","channel":{"channelName":"/777","channelMetadata":{"userCount":4}}},{"key":"APPCHANNELS./Wahrsagen","channel":{"channelName":"/Wahrsagen","channelMetadata":{"userCount":2}}},{"key":"APPCHANNELS./Lie6e","channel":{"channelName":"/Lie6e","channelMetadata":{"userCount":1}}},{"key":"APPCHANNELS./GötterDice x3","channel":{"channelName":"/GötterDice x3","channelMetadata":{"userCount":1}}},{"key":"APPCHANNELS./Schiffe versenken","channel":{"channelName":"/Schiffe versenken","channelMetadata":{"userCount":1}}},{"key":"APPCHANNELS./Spielkasino","channel":{"channelName":"/Spielkasino","channelMetadata":{"userCount":1}}},{"key":"APPCHANNELS./norbyte","channel":{"channelName":"/norbyte","channelMetadata":{"userCount":1}}}]}';
export default class PerformanceTest extends React.Component<any,any> {
private listEntries: any = JSON.parse(data);
private ds = new ListView.DataSource({
rowHasChanged: (r1, r2) =>
r1 !== r2,
sectionHeaderHasChanged: (s1, s2) =>
s1 !== s2
});
constructor(props: any) {
super(props);
}
render() {
const newDS = this.ds.cloneWithRowsAndSections(this.listEntries);
return (
<View style={{flexDirection:'column', alignItems:'stretch', flex:1}}>
<TouchableOpacity style={{height: 50, backgroundColor: 'skyblue'}} onPress={() => console.log("Click")}>
<Text>Test</Text>
</TouchableOpacity>
<ListView
initialListSize={1000}
dataSource={newDS}
pageSize={10}
renderRow={
(c:any,index:number) => {
return (
<View key={c.key} style={{flexDirection:'row', flex:1,alignItems:'center', marginHorizontal: SPACING.LARGE}}>
<View style={{width: 32, height: 32, backgroundColor:DEFAULT_COLORS.Green}}/>
<View style={{flexDirection:'column', flex:1, paddingLeft:SPACING.SMALL}}>
<View
style={{flexDirection:'row', paddingTop:SPACING.SMALLER + SPACING.TINY, paddingBottom:SPACING.TINY + SPACING.SMALLER}}>
<Text numberOfLines={1} style={{flex:1, paddingLeft: SPACING.TINY}}>
{c.channel.channelName}
</Text>
<Text style={{flex: 1, paddingLeft: SPACING.SMALL}}>{c.channel.channelMetadata.userCount}</Text>
</View>
{this.props.hasSeparator &&
<View style={{
height: 1,
backgroundColor: DEFAULT_COLORS.LineDivider,
borderRadius:3}}/>
}
</View>
</View>
)
}
}
renderSectionHeader={
(data: any, category:any) => {
return (<Text>{category}</Text>);
}
}>
</ListView>
</View>
);
}
}
任何想法或帮助将不胜感激。谢谢