RN

bainian發表於2019-02-19

國際化支援：

$ yarn add react-native-i18n  # 第三方多語言庫
$ yarn add react-native-device-info # 使用者獲取系統本地語言環境 
$ react-native link react-native-device-info
    I18n.getLanguages 獲取使用者首選的語言環境
    I18n.locale : 設定本地語言環境。
    I18n.defaultLocale 首選預設語言
    I18n.fallbacks : 看文件說明我理解的意思是：如果獲取到的系統語言類似en_US en-GB這樣的，外掛初始化的時候發現沒有en_US.js en-GB.js，這個時候如果設定了I18n.fallbacks = true;系統就會按這樣的（en_US en.js）順序去查詢檔案，就會去找有一個en.js這樣的檔案， 官方建議使用I18n.fallbacks = true;
複製程式碼
let timeStamp = Math.floor(new Date().getTime() / 1000).toString(); // 時間戳整數部分,是用秒為單位的。
複製程式碼

react-native中的text元件，如果不設定寬度的話，預設是父元件的寬度，顯示不下才會進行換行，開發中遇到遇到兩種情況：一個image & text 採用橫向佈局，如果不設定text的寬度的話，超過父元件的寬度，右側的文字會有丟失的情況；一個text & image 採用橫向佈局，如果不設定text的寬度的話，text會預設佔用父元件的全部寬度，結果右側的image被擠到了父元件之外.

JS 中的require 和 import 區別

這兩個都是為了JS模組化程式設計使用. 遵循規範 require 是 AMD規範引入方式 import是es6的一個語法標準，如果要相容瀏覽器的話必須轉化成es5的語法 呼叫時間 require是執行時呼叫，所以require理論上可以運用在程式碼的任何地方 import是編譯時呼叫，所以必須放在檔案開頭 本質 require是賦值過程，其實require的結果就是物件、數字、字串、函式等，再把require的結果賦值給某個變數 import是解構過程，但是目前所有的引擎都還沒有實現import，我們在node中使用babel支援ES6，也僅僅是將ES6轉碼為ES5再執行，import語法會被轉碼為require require / exports ： 遵循 CommonJS/AMD，只能在執行時確定模組的依賴關係及輸入/輸出的變數，無法進行靜態優化。 用法只有以下三種簡單的寫法：

const fs = require('fs')
exports.fs = fs
module.exports = fs
import / export：
// 遵循 ES6 規範，支援編譯時靜態分析，便於JS引入巨集和型別檢驗。動態繫結。
// 寫法就比較多種多樣：

import fs from 'fs'
import {default as fs} from 'fs'
import * as fs from 'fs'
import {readFile} from 'fs'
import {readFile as read} from 'fs'
import fs, {readFile} from 'fs'

export default fs
export const fs
export function readFile
export {readFile, read}
export * from 'fs'
複製程式碼

通過require引入基礎資料型別時，屬於複製該變數。 通過require引入複雜資料型別時，資料淺拷貝該物件。 出現模組之間的迴圈引用時，會輸出已經執行的模組，而未執行的模組不輸出（比較複雜） CommonJS模組預設export的是一個物件，即使匯出的是基礎資料型別

module.exports.modifyFile = function(){...};
import { DeviceEventEmitter } from 'react-native' // 引入
DeviceEventEmitter.addListener('message',param => {
      this.setState({spotShow:param.spotShow})
      console.log(param)
    });
    
// 新的方法寫法，
class A {
    hide = toast => {
        if (toast instanceof RootSiblings) {
            toast.destroy();
        }
    };
}
複製程式碼

相關文章