在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 教程/ HTML/ iOS 應(yīng)用程序狀態(tài)
JavaScript 環(huán)境
計(jì)時(shí)器
Native 模塊(iOS)
入門(mén)
在設(shè)備上運(yùn)行
ProgressBarAndroid
iOS 應(yīng)用程序狀態(tài)
網(wǎng)絡(luò)
ToolbarAndroid
測(cè)試
輔助功能
網(wǎng)絡(luò)信息
DrawerLayoutAndroid
樣式表
手勢(shì)應(yīng)答系統(tǒng)
與現(xiàn)有的應(yīng)用程序集成
樣式
教程
不透明觸摸
調(diào)試 React Native 應(yīng)用
iOS 活動(dòng)指示器
導(dǎo)航器
無(wú)反饋觸摸
動(dòng)畫(huà)布局
Web 視圖
鏈接庫(kù)
像素比率
React Native 官網(wǎng)首頁(yè)介紹
iOS 導(dǎo)航器
交互管理器
全景響應(yīng)器
SwitchAndroid
TabBarIOS.Item
相機(jī)滾動(dòng)
ToastAndroid
iOS 震動(dòng)
BackAndroid
文本輸入
iOS 選擇器
應(yīng)用程序注冊(cè)表
iOS 開(kāi)關(guān)
滾動(dòng)視圖
iOS 日期選擇器
iOS 警告
iOS 鏈接
視圖
圖片
列表視圖
異步存儲(chǔ)
Native UI 組件(Android)
iOS 滑塊
Map 視圖
高亮觸摸
iOS 推送通知
文本
定位
iOS 狀態(tài)欄
Native UI 組件(iOS)
在設(shè)備上運(yùn)行(Android)
Native 模塊(Android)
Flexbox
已知 Issues
iOS 選項(xiàng)卡
安裝 Android 運(yùn)行環(huán)境

iOS 應(yīng)用程序狀態(tài)

AppStateIOS 可以告訴你應(yīng)用程序是在前臺(tái)還是在后臺(tái),而且狀態(tài)更新時(shí)會(huì)通知你。 在處理推送通知時(shí),AppStateIOS 經(jīng)常被用于判斷目標(biāo)和適當(dāng)?shù)男袨椤?

iOS 應(yīng)用程序狀態(tài)

  • Active - 應(yīng)用程序在前臺(tái)運(yùn)行
  • Background - 應(yīng)用程序在后臺(tái)運(yùn)行。用戶正在使用另一個(gè)應(yīng)用程序或者在主屏幕上。
  • Inactive - 這是一種過(guò)渡狀態(tài),目前不會(huì)在React Native的應(yīng)用程序上發(fā)生。

想要獲取更多的信息,見(jiàn)

基本用法

為了查看當(dāng)前的狀態(tài),你可以檢查 AppStateIOS.currentState,該方法會(huì)一直保持最新?tīng)顟B(tài)。然而,當(dāng) AppStateIOS 在橋接器上檢索currentState時(shí),在啟動(dòng)時(shí)它將會(huì)為空。

    getInitialState: function() {
      return {
        currentAppState: AppStateIOS.currentState,
      };
    },
    componentDidMount: function() {
      AppStateIOS.addEventListener('change', this._handleAppStateChange);
    },
    componentWillUnmount: function() {
      AppStateIOS.removeEventListener('change', this._handleAppStateChange);
    },
    _handleAppStateChange: function(currentAppState) {
      this.setState({ currentAppState, });
    },
    render: function() {
      return (
       <Text>Current state is: {this.state.currentAppState}</Text>
      );
    },

這個(gè)例子似乎只能說(shuō)"當(dāng)前狀態(tài)是:活躍的"因?yàn)樵?active 狀態(tài)時(shí),應(yīng)用程序只對(duì)用戶是可見(jiàn)的,空狀態(tài)只能是暫時(shí)的。

方法

static addEventListener(type: string, handler: Function)

通過(guò)監(jiān)聽(tīng) change 事件類型和提供處理程序,為應(yīng)用程序狀態(tài)變化添加一個(gè)處理程序。

static removeEventListener(type: string, handler: Function)

通過(guò)傳遞 change 事件類型和處理程序,刪除一個(gè)處理程序。

例子

Edit on GitHub

    'use strict';
    var React = require('react-native');
    var {
      AppStateIOS,
      Text,
    View
    } = React;
    var AppStateSubscription = React.createClass({
      getInitialState() {
        return {
          appState: AppStateIOS.currentState,
          previousAppStates: [],
        };
      },
      componentDidMount: function() {
        AppStateIOS.addEventListener('change', this._handleAppStateChange);
      },
      componentWillUnmount: function() {
        AppStateIOS.removeEventListener('change', this._handleAppStateChange);
      },
      _handleAppStateChange: function(appState) {
        var previousAppStates = this.state.previousAppStates.slice();
        previousAppStates.push(this.state.appState);
        this.setState({
          appState,
          previousAppStates,
        });
      },
      render() {
        if (this.props.showCurrentOnly) {
          return (
            <View>
              <Text>{this.state.appState}</Text>
            </View>
          );
        }
        return (
          <View>
            <Text>{JSON.stringify(this.state.previousAppStates)}</Text>
          </View>
        );
      }
    });
    exports.title = 'AppStateIOS';
    exports.description = 'iOS app background status';
    exports.examples = [
      {
        title: 'AppStateIOS.currentState',
        description: 'Can be null on app initialization',
        render() { return <Text>{AppStateIOS.currentState}</Text>; }
      },
      {
        title: 'Subscribed AppStateIOS:',
        description: 'This changes according to the current state, so you can only ever see it rendered as "active"',
        render(): ReactElement { return <AppStateSubscription showCurrentOnly={true} />; }
      },
      {
        title: 'Previous states:',
        render(): ReactElement { return <AppStateSubscription showCurrentOnly={false} />; }
      },
    ];