本發(fā)明涉及React Native技術(shù)領(lǐng)域，尤其涉及一種在React Native組件之間傳遞native對(duì)象的方法和裝置。

背景技術(shù)：

React Native是一種允許開發(fā)者使用前端語言搭建原生App的技術(shù)，其原理是對(duì)原生UI組件進(jìn)行封裝，達(dá)到使用javascript調(diào)配原生UI組件構(gòu)建界面的目的。搭建的原生App同時(shí)具有web App的靈活性，并且具有良好交互體驗(yàn)的優(yōu)點(diǎn)。

在利用React Native進(jìn)行實(shí)際開發(fā)中，經(jīng)常需要在React Native的組件/API之間通過javascript傳遞數(shù)據(jù)，即其中一個(gè)React Native的組件/API發(fā)送數(shù)據(jù)至javascript，javascript經(jīng)過業(yè)務(wù)處理后將數(shù)據(jù)發(fā)送至另一個(gè)React Native組件/API來使用。數(shù)據(jù)的通用類型為整型、浮點(diǎn)型、字符串、數(shù)組、字典等，上述類型的數(shù)據(jù)可以直接在javascript和React Native組件/API之間傳遞。但是，ReactNative框架無法將某些特殊的native對(duì)象如image對(duì)象、自定義的model等轉(zhuǎn)換成javascript可識(shí)別的對(duì)象，只能將native對(duì)象的內(nèi)存地址當(dāng)作16進(jìn)制數(shù)或字符串來處理；另一個(gè)問題是在對(duì)象交給javascript后，native對(duì)象的生命周期如何管理。因此，需要一種在React Native組件之間傳遞native對(duì)象的方法和裝置，以解決現(xiàn)有技術(shù)中存在的上述技術(shù)問題。

技術(shù)實(shí)現(xiàn)要素：

本發(fā)明提供一種在React Native組件之間傳遞native對(duì)象的方法和裝置，通過javascript傳遞任一類型的native對(duì)象。

本發(fā)明采用的技術(shù)方案是：一種在React Native組件之間傳遞native對(duì)象的方法，包括：內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象；第一React Native組件發(fā)送所述裝箱對(duì)象至javascript業(yè)務(wù)邏輯模塊；第二React Native組件接收所述javascript業(yè)務(wù)邏輯模塊轉(zhuǎn)發(fā)的所述裝箱對(duì)象；所述內(nèi)存數(shù)據(jù)管理模塊對(duì)所述裝箱對(duì)象進(jìn)行拆箱操作后得到所述native對(duì)象。

優(yōu)選地，所述內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象之后，所述方法，還包括：保存所述待裝箱的native對(duì)象的強(qiáng)引用。

優(yōu)選地，所述保存所述待裝箱的native對(duì)象的強(qiáng)引用之后，所述方法，還包括：所述javascript業(yè)務(wù)邏輯模塊發(fā)送釋放指令至內(nèi)存數(shù)據(jù)管理組件；所述內(nèi)存數(shù)據(jù)管理組件基于所述釋放指令調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的移除引用接口移除所述待裝箱的native對(duì)象的強(qiáng)引用。

優(yōu)選地，所述內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象之前，所述方法，還包括：所述第一React Native組件調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的裝箱方法；相應(yīng)地，所述內(nèi)存數(shù)據(jù)管理模塊對(duì)所述裝箱對(duì)象進(jìn)行拆箱操作后得到所述native對(duì)象之前，所述方法，還包括：所述第二React Native組件調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的拆箱方法。

本發(fā)明還提供了一種在React Native組件之間傳遞native對(duì)象的裝置，包括：內(nèi)存數(shù)據(jù)管理模塊，用于將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象；第一React Native組件，用于發(fā)送所述裝箱對(duì)象至javascript業(yè)務(wù)邏輯模塊；第二React Native組件，用于接收所述javascript業(yè)務(wù)邏輯模塊轉(zhuǎn)發(fā)的所述裝箱對(duì)象；所述內(nèi)存數(shù)據(jù)管理模塊，還用于對(duì)所述裝箱對(duì)象進(jìn)行拆箱操作后得到所述native對(duì)象。

優(yōu)選地，所述數(shù)據(jù)管理保存模塊，還用于：保存所述待裝箱的native對(duì)象的強(qiáng)引用。

優(yōu)選地，所述裝置，還包括，內(nèi)存數(shù)據(jù)管理組件，用于：所述javascript業(yè)務(wù)邏輯模塊發(fā)送釋放指令至所述內(nèi)存數(shù)據(jù)管理組件的條件下，所述內(nèi)存數(shù)據(jù)管理組件基于所述釋放指令調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的移除引用接口移除所述待裝箱的native對(duì)象的強(qiáng)引用。

優(yōu)選地，所述第一React Native組件，還用于：在所述內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象之前，調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的裝箱方法；相應(yīng)地，所述第二React Native組件，還用于：在所述內(nèi)存數(shù)據(jù)管理模塊對(duì)所述裝箱對(duì)象進(jìn)行拆箱操作后得到所述native對(duì)象之前，所述第二React Native組件調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的拆箱方法。

采用上述技術(shù)方案，本發(fā)明至少具有下列效果：

采用本發(fā)明的在React Native組件之間傳遞native對(duì)象的方法，通過javascript傳遞任一類型的native對(duì)象。

附圖說明

圖1為本發(fā)明第一實(shí)施例在React Native組件之間傳遞native對(duì)象的方法的流程圖；

圖2為本發(fā)明第二實(shí)施例在React Native組件之間傳遞native對(duì)象的方法的流程圖；

圖3為本發(fā)明第四實(shí)施例在React Native組件之間傳遞native對(duì)象的裝置中內(nèi)存數(shù)據(jù)管理模塊的方框圖。

具體實(shí)施方式

為更進(jìn)一步闡述本發(fā)明為達(dá)成預(yù)定目的所采取的技術(shù)手段及功效，以下結(jié)合附圖及較佳實(shí)施例，對(duì)本發(fā)明進(jìn)行詳細(xì)說明如后。

本發(fā)明提供的在React Native組件之間傳遞native對(duì)象的方法，可以通過javascript傳遞任一類型的native對(duì)象。下面將詳細(xì)地描述本發(fā)明的在ReactNative組件之間傳遞native對(duì)象的方法及其各個(gè)步驟。

其中，React Native為facebook推出的一項(xiàng)使用javascript和react構(gòu)建原生app的技術(shù)。需要說明的是，本發(fā)明所涉及的native對(duì)象，均是現(xiàn)有技術(shù)中javascript無法使用的native對(duì)象。在React Native中，這些native對(duì)象由某一個(gè)React Native組件或React Native接口產(chǎn)生，經(jīng)由javascript傳遞給另外的ReactNative組件或者React Native接口進(jìn)行使用，Javascript本身不使用這些ReactNative對(duì)象。

第一實(shí)施例

如圖1和圖2所示，本實(shí)施例公開的在React Native組件之間傳遞native對(duì)象的方法，包括：步驟S2：內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件(如圖2中的React Native組件A)的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象；步驟S4：第一React Native組件發(fā)送裝箱對(duì)象至javascript業(yè)務(wù)邏輯模塊；步驟S5：第二React Native組件(如圖2中的react native組件B)接收javascript業(yè)務(wù)邏輯模塊轉(zhuǎn)發(fā)的裝箱對(duì)象；步驟S6：內(nèi)存數(shù)據(jù)管理模塊對(duì)裝箱對(duì)象進(jìn)行拆箱操作后得到native對(duì)象。

本實(shí)施例通過在native端封裝內(nèi)存數(shù)據(jù)管理模塊來實(shí)現(xiàn)待裝箱的native對(duì)象的封裝和拆箱操作，實(shí)現(xiàn)javascript業(yè)務(wù)邏輯模塊不能識(shí)別的native對(duì)象的傳遞。

Javascript業(yè)務(wù)邏輯模塊，由前端開發(fā)者使用javascript進(jìn)行業(yè)務(wù)開發(fā)的邏輯，它依賴于React Native組件，使用React Native組件和接口完成界面的搭建和調(diào)用native的功能。Javascript業(yè)務(wù)邏輯模塊通過內(nèi)存數(shù)據(jù)管理模塊在封裝的裝箱對(duì)象中添加標(biāo)識(shí)位來判斷得到的裝箱對(duì)象是裝箱的數(shù)據(jù)還是通用類型的數(shù)據(jù)。

第二實(shí)施例

如圖2所示，在第一實(shí)施例的基礎(chǔ)上，步驟S2：內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件(如圖2中的React Native組件A)的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象之后，本實(shí)施例的在React Native組件之間傳遞native對(duì)象的方法，還包括：步驟S3：保存待裝箱的native對(duì)象的強(qiáng)引用。本實(shí)施例的目的為，在裝箱時(shí)，內(nèi)存數(shù)據(jù)管理模塊保留待裝箱的native對(duì)象的強(qiáng)引用，防止native對(duì)象被釋放。

進(jìn)一步地，步驟S3：保存待裝箱的native對(duì)象的強(qiáng)引用之后，本實(shí)施例的在React Native組件之間傳遞native對(duì)象的方法，還包括：步驟S8：javascript業(yè)務(wù)邏輯模塊發(fā)送釋放指令至內(nèi)存數(shù)據(jù)管理組件；內(nèi)存數(shù)據(jù)管理組件基于釋放指令調(diào)用內(nèi)存數(shù)據(jù)管理模塊的移除引用接口移除待裝箱的native對(duì)象的強(qiáng)引用。本實(shí)施例封裝內(nèi)存數(shù)據(jù)管理組件，實(shí)現(xiàn)javascript通過該內(nèi)存數(shù)據(jù)管理組件直接操作裝箱后的native對(duì)象的強(qiáng)引用，保證native對(duì)象的完整生命周期，防止內(nèi)存數(shù)據(jù)管理模塊對(duì)native對(duì)象一直不釋放。

第三實(shí)施例

如圖2所示，在第一實(shí)施例和第二實(shí)施例的基礎(chǔ)上，步驟S2：內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件(如圖2中的React Native組件A)的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象之前，本實(shí)施例的在React Native組件之間傳遞native對(duì)象的方法，還包括：第一React Native組件調(diào)用內(nèi)存數(shù)據(jù)管理模塊的裝箱方法；相應(yīng)地，步驟S6：內(nèi)存數(shù)據(jù)管理模塊對(duì)裝箱對(duì)象進(jìn)行拆箱操作后得到native對(duì)象之前，本實(shí)施例的在React Native組件之間傳遞native對(duì)象的方法，還包括：第二React Native組件(如圖2中的React Native組件B)調(diào)用內(nèi)存數(shù)據(jù)管理模塊的拆箱方法。

本實(shí)施例在native端建立內(nèi)存數(shù)據(jù)管理模塊，用于管理需要交由javascript傳遞的native對(duì)象，第一React Native組件在需要將native對(duì)象傳遞至javascript之前，調(diào)用內(nèi)存數(shù)據(jù)管理模塊的裝箱方法，將該native對(duì)象封裝為通用類型的裝箱對(duì)象。當(dāng)?shù)诙eact Native組件接收到該裝箱對(duì)象時(shí)，調(diào)用內(nèi)存數(shù)據(jù)管理模塊的拆箱方法，獲得原來的待裝箱的native對(duì)象。

第四實(shí)施例

如圖2所示，本實(shí)施例提供了一種在React Native組件之間傳遞native對(duì)象的裝置，包括：內(nèi)存數(shù)據(jù)管理模塊，用于將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象；第一React Native組件(如圖2中的ReactNative組件A)，用于發(fā)送裝箱對(duì)象至javascript業(yè)務(wù)邏輯模塊；第二React Native組件(如圖2中的React Native組件B)，用于接收javascript業(yè)務(wù)邏輯模塊轉(zhuǎn)發(fā)的裝箱對(duì)象；內(nèi)存數(shù)據(jù)管理模塊，還用于對(duì)裝箱對(duì)象進(jìn)行拆箱操作后得到native對(duì)象。

如圖3所示，內(nèi)存數(shù)據(jù)管理模塊為native端提供對(duì)native對(duì)象進(jìn)行裝箱和拆箱的native接口，裝箱接口將native的特殊類型的native對(duì)象轉(zhuǎn)換為javascript可以接收的通用類型，拆箱接口則執(zhí)行相反的操作，將裝箱后的數(shù)據(jù)還原為待裝箱的native對(duì)象。

第五實(shí)施例

如圖2所示，在React Native組件之間傳遞native對(duì)象的裝置中，內(nèi)存數(shù)據(jù)管理保存模塊，還用于：保存待裝箱的native對(duì)象的強(qiáng)引用。

進(jìn)一步地，本實(shí)施例的在React Native組件之間傳遞native對(duì)象的裝置，還包括，內(nèi)存數(shù)據(jù)管理組件，用于：javascript業(yè)務(wù)邏輯模塊發(fā)送釋放指令至內(nèi)存數(shù)據(jù)管理組件的條件下，內(nèi)存數(shù)據(jù)管理組件基于釋放指令調(diào)用內(nèi)存數(shù)據(jù)管理模塊的移除引用接口(參見圖3的RN接口中的移除引用接口)移除待裝箱的native對(duì)象的強(qiáng)引用。

內(nèi)存數(shù)據(jù)管理模塊維護(hù)一個(gè)數(shù)據(jù)結(jié)構(gòu)，例如一個(gè)堆棧，用于保存執(zhí)行了裝箱操作的native對(duì)象的強(qiáng)引用，防止native對(duì)象被釋放，并提供解除強(qiáng)引用對(duì)象的移除引用接口，該移除引用接口接收待裝箱的native對(duì)象或者裝箱后的裝箱對(duì)象，在所維護(hù)的數(shù)據(jù)結(jié)構(gòu)中將指定的待裝箱的native對(duì)象移除。

React Native內(nèi)存數(shù)據(jù)管理組件是javascript直接操作內(nèi)存數(shù)據(jù)管理模塊的通道。該組件至少提供一個(gè)移除待裝箱的native對(duì)象的強(qiáng)引用的移除接口，此移除接口對(duì)應(yīng)內(nèi)存數(shù)據(jù)管理模塊的移除引用接口進(jìn)行封裝，以便javascript在使用native對(duì)象完成后，通知內(nèi)存數(shù)據(jù)管理模塊釋放native對(duì)象，防止其釋放不掉，保證待裝箱的native對(duì)象的完整生命周期。另外可按需在該組件中添加其他接口，以使javascript對(duì)內(nèi)存數(shù)據(jù)管理模塊的操作更加靈活。

如圖3所示，在內(nèi)存數(shù)據(jù)管理模塊中，首先封裝數(shù)據(jù)存儲(chǔ)層，再封裝一層數(shù)據(jù)管理層，至少提供添加接口和刪除的接口(可根據(jù)需求自由添加替換和查找等其他接口)，為上層提供統(tǒng)一的服務(wù)。然后在數(shù)據(jù)管理層基礎(chǔ)上，封裝一個(gè)接口層，該接口層包括native接口和React Native接口(如圖中的RN接口)，分別封裝native調(diào)用接口和React Native調(diào)用接口。Native接口為React Native組件提供裝箱方法和拆箱方法，React Native接口為javascript提供移除待裝箱的native對(duì)象的強(qiáng)引用。

第六實(shí)施例

如圖2所示，第一React Native組件(如圖2中的React Native組件A)，還用于：在內(nèi)存數(shù)據(jù)管理模塊將第一React Native組件的待裝箱的native對(duì)象封裝為通用類型的裝箱對(duì)象之前，調(diào)用所述內(nèi)存數(shù)據(jù)管理模塊的裝箱方法；相應(yīng)地，第二React Native組件(如圖2中的React Native組件B)，還用于：在內(nèi)存數(shù)據(jù)管理模塊對(duì)裝箱對(duì)象進(jìn)行拆箱操作后得到native對(duì)象之前，第二React Native組件調(diào)用內(nèi)存數(shù)據(jù)管理模塊的拆箱方法。

第一React Native組件和第二React Native組件均是定制封裝的React Native組件，這些React Native組件依賴于內(nèi)存數(shù)據(jù)管理模塊，在需要將native端的特殊對(duì)象傳遞給javascript時(shí)，需要調(diào)用內(nèi)存數(shù)據(jù)管理模塊的裝箱方法，并將裝箱后的裝箱對(duì)象傳遞至javascript，在收到裝箱后的裝箱對(duì)象時(shí)，需要調(diào)用內(nèi)存數(shù)據(jù)管理模塊的拆箱方法獲得原來的待裝箱的native對(duì)象。

舉例說明

內(nèi)存數(shù)據(jù)管理模塊的裝箱接口接收一個(gè)id(任意)類型的native對(duì)象，用于指定待裝箱的native對(duì)象，返回一個(gè)字典類型數(shù)據(jù)，裝箱操作將待裝箱的id類型的native對(duì)象轉(zhuǎn)換為一個(gè)字典類型的裝箱對(duì)象，返回來的字典類型的裝箱對(duì)象包括至少一個(gè)key：“address”，用于記錄id類型的native對(duì)象的內(nèi)存地址。

在內(nèi)存數(shù)據(jù)管理模塊的拆箱接口接收一個(gè)字典類型的裝箱對(duì)象后，進(jìn)行拆箱操作后返回原來的id類型的native對(duì)象。拆箱操作解析字典類型的裝箱對(duì)象，將“address”指向的內(nèi)存地址，轉(zhuǎn)換為id類型的native對(duì)象。

在內(nèi)存數(shù)據(jù)管理模塊中，添加一個(gè)字典類型的數(shù)據(jù)結(jié)構(gòu)，稱為裝箱對(duì)象生命周期管理字典，在內(nèi)存數(shù)據(jù)管理模塊初始化時(shí)初始化該數(shù)據(jù)結(jié)構(gòu)。在每次執(zhí)行裝箱操作時(shí)，使用裝箱對(duì)象中的key：“address”對(duì)應(yīng)的值作為key，以裝箱操作的id類型的native對(duì)象作為值，向裝箱對(duì)象生命周期管理字典中插入一條數(shù)據(jù)。另外，移除引用接口接收一個(gè)id類型的native對(duì)象后，返回第二React Native組件的值為空。移除引用接口先判斷接收的native對(duì)象是否為字典類型，如果是字典類型，則認(rèn)為是裝箱后的裝箱對(duì)象，讀取“address”字段的值，并在裝箱對(duì)象生命周期管理字典中移除以此值為key的數(shù)據(jù)；如果接收的native對(duì)象不是字典類型，則認(rèn)為是裝箱之前的待裝箱的native對(duì)象，將該待裝箱的native對(duì)象所指向的對(duì)象內(nèi)存地址轉(zhuǎn)為字符串，并在裝箱對(duì)象生命周期管理字典中移除以此字符串為key的數(shù)據(jù)。

通過具體實(shí)施方式的說明，應(yīng)當(dāng)可對(duì)本發(fā)明為達(dá)成預(yù)定目的所采取的技術(shù)手段及功效得以更加深入且具體的了解，然而所附圖示僅是提供參考與說明之用，并非用來對(duì)本發(fā)明加以限制。