Listview

• category: UI
• chinese: 列表
• type: UI Component

Usage

Be used to show a datalist, which is different with ScrollView, ListView uses the weex list component memory reuse capability, in order to reuse cell smoothly.

API

ListView

| Attribute | Description | Type | Default | | --------------------- | ----------------------------------------------------- | ---------------- | ------- | | renderHeader | header | function | null | | renderFooter | footer | function | null | | renderRow | render single row | function | null | | dataSource | data source | array | null | | onEndReached | The event that was triggered when the unit was loaded | onloadmore event | null | | onEndReachedThreshold | load more displacement | string | 500 | | showScrollbar | show the scroll bar | bool | null | | resetLoadmore | reset the loadmore count(explanation following) | function | null |

resetLoadmore demo reference

This is a method that reset the flag of onEndReached can be triggered?. The flag's default value is true, that is, which scrolls to the bottom to trigger the onEndReached event. However, the native app will set the flag to false, if the target has triggered the onEndReached event but the content of page scroller becomes more ( or less instead ) without loading more data through the setState.

Call the resetLoadmore to reset the flag so that the onEndReachen event could be triggered again.

    //Call the resetLoadmore to reset the flag so that the onEndReachen event could be triggered again.
    reset=(e)=>{
        this.refs.mylist.resetLoadmore();
    }
    render(){
        return (
                <ListView ref="mylist"
                    renderHeader={this.renderHeader}
                    renderFooter={this.renderFooter}
                    renderRow={this.renderItem}
                    dataSource={this.state.data}
                ><ListView/>
        )
    }

The Other

• Chat with @翊晨[yichen] in Dingtalk desktop App Download
• DingTalk Group