SortableListView渲染不出来
来源:5-10 Popular(最热)模块的标签排序功能实现-1

慕无忌King
2018-09-21
已经导入相应的包
import SortableListView from 'react-native-sortable-listview'
render方法
render() {
return (
<View >
<NavigationBar
title={'标签排序'}
style={{
backgroundColor:'#6495ed'
}}
/>
<SortableListView
data={this.state.checkedArray}
order={Object.keys(this.state.checkedArray)}
onRowMoved={(e)=>{
this.state.checkedArray.splice(e.to, 0, this.state.checkedArray.splice(e.from, 1)[0]);
}}
renderRow={(row)=> <SortCell data={row}/>}
/>
</View>
);
}
sortCell
class SortCell extends Component {
render() {
let name = this.props.data.name;
console.log(name)
return (
<View>
<Text>{name}</Text>
</View>
);
}
}
找了半天,并没有出错的地方,直到在跟视图的view加上style={{flex:1}},
SortableListView的style={{flex:1}}以后才显示出来,这是为什么呢
修改后的render方法
render() {
return (
//加上了style:flex:1
<View style={{flex: 1}}>
<NavigationBar
title={'标签排序'}
style={{
backgroundColor:'#6495ed'
}}
/>
<SortableListView
//也加上了style:flex:1
style={{flex:1}}
data={this.state.checkedArray}
order={Object.keys(this.state.checkedArray)}
onRowMoved={(e)=>{
this.state.checkedArray.splice(e.to, 0, this.state.checkedArray.splice(e.from, 1)[0]);
}}
renderRow={(row)=> <SortCell data={row}/>}
/>
</View>
);
}
写回答
2回答
-
路程
2018-10-20
我感觉应该是老版Rn 的坑 ,在Android上用布局工具查看,如果顶层View 没有设置 flex ,根本连这个View js中代码所表示的<View> 在安卓中是ViewGroup, 都没有加入 到布局视图。
00 -
遍地_狼烟
2018-09-24
用fastlist
00
相似问题