1. 程式人生 > >基於React Native實現的介面載入元件react-native-loadview

基於React Native實現的介面載入元件react-native-loadview

react-native-loadview

基於React Native實現的介面載入元件,

Installation

npm install react-native-loadview --save

Import into your project

import LoadView from 'react-native-loadview';

Examle useage

用於介面資料處理load狀態展示,目前支援兩種gif載入方式

<LoadView style={Styles.loadView} visible={this.props.showIndicator}
gif='triangles' />
<WebView
    source={{ uri: url }}
    onShouldStartLoadWithRequest={e => this.onShouldStartLoadWithRequest(e)}
    startInLoadingState
    onError={e => this.onError(e)}
    renderLoading={() => <LoadView/>}
    renderError={() => this.renderError()}
    onNavigationStateChange=
{e => this.onNavigationStateChange(e)} />

Properties

屬性 描述 型別 預設
iconSize gif大小 PropTypes.number 40
message 載入文字 PropTypes.string
visible 是否顯示 PropTypes.bool true
gif gif名稱 PropTypes.oneOf(["spinner", "triangles"]) ‘spinner’

GitHub專案地址