我正在使用react-native-sortable-listview通过拖放来改变列表项的顺序。仅再次拖动项目,以便更新其位置,但其他位置具有其先前的位置。当此组件由其他原因(如某些增量按钮)重新渲染时,所有位置都是正确的。
所以我的问题是当我的react-native-sortable-list被渲染时我怎么能再次重新渲染它。
由forceUpdate()
和this.setState()
呈现的两种方式都无法跟进,因为我无法在渲染函数中更新状态。
这可能是一种可行的方法。
答案 0 :(得分:0)
尝试使用componentWillMount或componentDidMount:
componentWillMount = () => {
this.setState({
data: myData
});
}
基本上在渲染组件的任何阶段,您需要捕获该事件并调用setState();您也可以通过按钮重新渲染。用户单击一个按钮,然后你setState();希望这有帮助!
答案 1 :(得分:0)
我不知道该列表,但应该有一些属性,如onDrop
或类似的东西。您可以将一个函数传递给可能开始对列表进行排序的事件处理程序,您正在传入。
是这个清单吗?
https://www.npmjs.com/package/react-native-sortable-list
我会尝试onReleaseRow
事件处理程序所做的事情。也许是这样的:
<SortableList onReleaseRow{() => this.sortList() data={this.state.data}}/>
sortList() {
let sortedData = //sort data somehow
this.setState({
data: sortedData})
}
答案 2 :(得分:0)
您可以将open class G
class H : G()
abstract class F {
abstract val g: G
}
class I : F() {
override var g : H = H()
}
功能传递给您的可排序列表。 ReactNativeList接受一个名为onChangeOrder的prop,每次更改行顺序时都会调用它。
reRender
答案 3 :(得分:0)
好的,我找到了一种重新渲染的方法,如下所示。
<SortableListView
key={this.state.count}
data={this.state.allObj}
order={this.state.order}
activeOpacity={0.5}
onRowMoved={e => {
this.setState({ count: this.state.count + 1 });
this.props.arrangedMilestoneList(e);
console.log('onRowMoved is called');
}}
onMoveEnd={() => console.log('onMoveEnd is fired')}
renderRow={(row, s1, i) => this.renderOneDraggableMilestone(row, s1, i)}
/>
我正在做的是向SortableListView
添加了一个关键属性,并在每个onRowMoved
操作上更新此密钥。因此,它会导致重新渲染。