本篇主要來詳細介紹如何安裝、升級外掛及講解一個react-native-tab-navigator的示例。

本文舉例使用的外掛：react-native-tab-navigator ，選項卡形式的導航

1. 通過  https://www.npmjs.com 找到我們想使用的外掛, 搜尋：react-native-tab-navigator

2. 我們可以看到外掛介紹頁面有詳細的介紹，以及如何安裝也有介紹，如下圖：

圖中紅色框選的是外掛在github的原始碼頁面地址～

3. 下面對專案進行安裝此外掛：

3.1  開啟終端，cd 到專案根路徑

3.2 使用命令：npm install react-native-tab-navigator –save

  進行安裝，如下圖：

3.3 安裝成功後，你會在專案下的package.json檔案內dependencies下看到(如下圖)：

            新增加了一條：”react-native-tab-navigator”: “^0.3.2”

4. 更新外掛的兩種方式方式（上）：

4.1:  開啟終端，cd 到目標專案根路徑

4.2 使用命令: npm install [email protected]yyy –save –registry zzz

 –save 記錄版本到專案的package.json下留底（一般最好都帶上）

 –registry 指定 映象源

 [email protected]

 ： @符號前是 外掛名，@符號後是外掛目標版本號

      （如果目標版本號yyy填：latest  表示該外掛的最新版本）  

zzz：制定的映象源地址

這裡舉例：

         npm install react-native[email protected] –save

        以上命令：更新react-native-tab-navigator外掛到最新  ，且將版本號記錄到專案的json檔案中。    

4. 更新外掛的兩種方式方式（下）：

4.2 :  安裝到專案中，然後利用命令：ncu  進行檢視版本，如下圖：

 

5. 外掛的使用：

5.1: 首先匯入（使用node_modules下的模組，不需要路徑）：

1	import TabNavigator from'react-native-tab-navigator';

5.2 :  繪製程式碼段：

12345678910111213141516171819202122232425262728293031

render(){return(......<TabNavigator tabBarStyle={styles.tab}><TabNavigator.Itemselected={this.state.selectedTab==='home'}title="Home"renderIcon={()=><Imagesource={require('./res/home_normal.png')}/>}renderSelectedIcon={()=><Imagesource={require('./res/home_focus.png')}/>}badgeText 相關推薦 【REACT NATIVE 系列教程之十一】外掛的安裝、使用與更新(示例:REACT-NATIVE-TAB-NAVIGATOR) 本篇主要來詳細介紹如何安裝、升級外掛及講解一個react-native-tab-navigator的示例。本文舉例使用的外掛：react-native-tab-navigator ，選項卡形式的導航1. 通過  https://www.npmjs.com 找到我們想使用的外掛, 搜尋：react-native 【REACT NATIVE 系列教程之十】真機執行報錯COMMAND /BIN/SH FAILED WITH EXIT CODE 1 的解決方法 Himi最近在真機執行遇到  Command /bin/sh failed with exit code 1  的錯誤， 模擬器執行沒有任何問題。此問題已解決，這裡分享下解決方案。先來看下錯誤日誌，如下圖：主要是劃線的部分：1.PhaseScriptExecution Bundle\ React\ Nativ 【OpenCV入門教程之十一】 形態學影象處理（二）：開運算、閉運算、形態學梯度、頂帽、黑帽合輯 上篇文章中，我們重點了解了腐蝕和膨脹這兩種最基本的形態學操作，而運用這兩個基本操作，我們可以實現更高階的形態學變換。所以，本文的主角是OpenCV中的morphologyEx函式，它利用基本的膨脹和腐蝕技術，來執行更加高階的形態學變換，如開閉運算、形態學梯度、“頂帽”、“黑帽 【REACT NATIVE 系列教程之四】重新整理元件RENDER(重新渲染)的三種方式詳解 開發過遊戲的都應該很清楚，“刷屏”是多麼的重要。其實開發應用也如此，當元件的資料被修改後，如何及時更新元件呈現出最新的資料與效果一樣至關重要。那麼這裡Himi大概講三種常用的方式：this.setState()  【最為常用】這是在事件處理函式中和請求回撥函式中觸發 UI 更新的主要方法。一般情況下setSt 【REACT NATIVE 系列教程之九】REACT NATIVE版本升級步驟與注意事項！        由於React Native處於快速迭代發展中，因此元件功能的擴充套件、語法的變更也將會有較大的區別，因此升級版本則屬於務必掌握的了。昨天Himi剛從0.23版本升級到0.26，升級的主要原因有兩點：1. 一些元件在最新版本中加入了很多新的屬性，例如0.23版本中Modal動畫沒有最新的屬性：a 【REACT NATIVE 系列教程之五】NAVIGATOR(頁面導航)的基本使用與傳參 今天介紹一種應用開發中常用的負責頁面切換及導航功能的元件：Navigator一：Navigator對於頁面導航其實主要功能就是：每個頁面都知道本身應該切換到哪個頁面，並且切到的頁面會記錄從哪裡來，如果要返回的話，知道返回到哪個頁面。這一切都不需要再用邏輯管理！而且每個頁面之間也可以進行引數傳遞，很方便的元件。 【REACT NATIVE 系列教程之十三】利用LISTVIEW與TEXTINPUT製作聊天/對話方塊&&獲取元件例項常用的兩種方式 補充說明：一：很多童鞋問，鍵盤調出來被擋住了，那麼下面給出三個解決方案：1. 在render最外層包一個ScrollView，然後當鍵盤調出時，scrollTo即可實現。2. 在底部新增一個可變化高度的view，根據鍵盤獲取、失去焦點時，進行處理實現二：有的童鞋說對話方塊的背景沒有根據內容長短自適應，OK ， 【白話經典算法系列之十一】一道有趣的GOOGLE面試題 --【解法2】                 上一篇《白話經典算法系列之十一道有趣的GOOGLE面試題》中對一道有趣的GOOGLE面試題進行了詳細的講解，使用了類似於基數排序的做法在O(N)的時間複雜度和O(1)的空間複雜度完成了題目的要求，文章發表後，網友fengchaokobe在評論中給出了另一種解法，見下圖。文字版： 【OpenCV入門教程之十二】OpenCV邊緣檢測 Canny運算元 Sobel運算元 Laplace運算元 Scharr濾波                 本篇文章中，我們將一起學習OpenCV中邊緣檢測的各種運算元和濾波器——Canny運算元,Sobel運算元,Laplace運算元以及Scharr濾波器。文章中包含了五個淺墨為大家準備的詳細註釋的博文配套原始碼。在介紹四塊知識點的時候分別一個，以及最後的綜合示例中的一個。文章末尾 【OpenCV入門教程之十七】OpenCV重對映 SURF特徵點檢測合輯                 本篇文章中，我們一起探討了OpenCV中重對映和SURF特徵點檢測相關的知識點，主要一起了解OpenCV中重對映相關的函式remap，SURF演算法在OpenCV中的體現與應用。此博文一共有三個配套的麻雀雖小但五臟俱全的示例程式，其經過淺墨詳細註釋過的程式碼都在文中貼出，且文章 Java NIO系列教程（十一） Pipe 原文連結     作者：Jakob Jenkov     譯者：黃忠       校對：丁一 Java NIO 管道是2個執行緒之間的單向資料連線。Pipe有一個source通道和一個sink通道。資料會被寫到sink通道，從source通道讀取。 這裡是Pipe原理的圖示： 建立管道 通 OAuth 2.0系列教程（十一） 客戶端證書請求和響應 作者：Jakob Jenkov   譯者：林浩    校對：郭蕾 客戶端證書授權包含下面的引數： grant_type 必須。必須設定到客戶端證書中。 scope 可選。授權的作用域。 客戶端授權響應： 客戶端授權響應包含下面的引數： { "access_token" : Packet Tracer 思科模擬器入門教程 之十一 路由器靜態路由配置 實驗目標 掌握靜態路由的配置方法和技巧； 掌握通過靜態路由方式實現網路的連通性； 熟悉廣域網線纜的連結方式； 實驗背景      學校有新舊兩個校區，每個校區是一個獨立的區域網，為了使新舊校區能夠正常相互通訊，共享資源。每個校 清華EMBA課程系列思考之十一 -- 金融市場與投資分析 本次上課之前，同學們早就翹首企盼了，原因是本次的上課老師之一 - 楊之曙老師已然在2月份的課當中講述了管理經濟學當中給了大家非常深刻的印象，以至於在四月份的時候大家又邀請他回來給我們再講述了博弈論，其中的精彩已然在心頭回味，此刻就跟我儘快進入本次課堂，一起開始本次的心路修煉歷 Linux (x86) Exploit 開發系列教程之十 使用 Malloc Maleficarum 的堆溢位 使用 Malloc Maleficarum 的堆溢位 預備條件： 從 2004 年末開始，glibc malloc 變得更可靠了。之後，類似 unlink 的技巧已經廢棄，攻擊者沒有線索。但是在 2005 年末，Phantasmal Phatasma Express全系列教程之(十)：jade模板引擎 語法 前言 const ews 並且 如果 () handle 轉換 一、前言 隨著前端業務的不斷發展，頁面交互邏輯的不斷提高，讓數據和界面實現分離漸漸被提了出來。JavaScript的MVC思想也流行了起來，在這種背景下，基於node.js的模板引擎也隨之出現。 什麽 Spring Boot2 系列教程(二十一)整合 MyBatis 前面兩篇文章和讀者聊了 Spring Boot 中最簡單的資料持久化方案 JdbcTemplate，JdbcTemplate 雖然簡單，但是用的並不多，因為它沒有 MyBatis 方便，在 Spring+SpringMVC 中整合 MyBatis 步驟還是有點複雜的，要配置多個 Bean，Spring Boo Spring Boot2 系列教程(三十一)Spring Boot 構建 RESTful 風格應用 RESTful ，到現在相信已經沒人不知道這個東西了吧！關於 RESTful 的概念，我這裡就不做過多介紹了，傳統的 Struts 對 RESTful 支援不夠友好 ，但是 SpringMVC 對於 RESTful 提供了很好的支援，常見的相關注解有： @RestController @GetMapping 刨根究底字符編碼之十一——UTF-8編碼方式與字節序標記 所有 碼元 unix 找到 概念 不可見 執行 大端 位置 UTF-8編碼方式與字節序標記 一、UTF-8編碼方式 1. 接下來將分別介紹Unicode字符集的三種編碼方式：UTF-8、UTF-16、UTF-32。這裏先介紹應用最為廣泛的UTF-8。 為滿足基於AS SEO自學網體系教程第十一節：網站日誌與SEO   首先，說說怎麼檢視網站日誌。以IIS中介軟體為例。     選擇一個網站 --> 高階設定 ，記住這裡的ID   然後到系統盤(日誌檔案一般在系統盤)，一般在C:inetpublogsLogFiles