React Native聯系人組件

changfeng1050 發布于2019-08-21 17:43 / 887人閱讀

摘要：通訊錄聯系人組件，名叫，可以用來增加讀取修改刪除搜索手機通訊錄中的聯系人信息，兼容和安卓雙平臺。安裝權限配置需要增加讀取聯系人的權限，在中增加一個。在需要用的時候，直接讀取本地數據庫，這樣速度比較快。

本文原創首發于公眾號：ReactNative開發圈，轉載需注明出處。

React Native通訊錄聯系人組件，名叫：react-native-contacts，可以用來增加、讀取、修改、刪除、搜索手機通訊錄中的聯系人信息，兼容IOS和安卓雙平臺。

安裝

npm install react-native-contacts
react-native link react-native-contacts

iOS權限配置

需要增加讀取聯系人的權限，在Info.plist中增加一個key："Privacy - Contacts Usage Description”。

Android權限配置

在android/app/src/main/AndroidManifest.xml中增加以下權限：

支持的方法

示例 增加聯系人

var newPerson = {
  emailAddresses: [{
    label: "work",
    email: "mrniet@example.com",
  }],
  familyName: "Nietzsche",
  givenName: "Friedrich",
}

Contacts.addContact(newPerson, (err) => { /*...*/ })

更新和刪除聯系人

Contacts.getAll( (err, contacts) => {
  //update the first record
  let someRecord = contacts[0]
  someRecord.emailAddresses.push({
    label: "junk",
    email: "mrniet+junkmail@test.com",
  })
  Contacts.updateContact(someRecord, (err) => { /*...*/ })

  //delete the second record
  Contacts.deleteContact(contacts[1], (err) => { /*...*/ })
})

獲取所有聯系人

var Contacts = require("react-native-contacts")

Contacts.getAll((err, contacts) => {
  if(err === "denied"){
    // error
  } else {
    // contacts returned in []
  }
})

如果聯系人比較多的話，getAll方法會比較慢，作者建議先獲取好所有聯系人，存儲在本地數據庫中。在需要用的時候，直接讀取本地數據庫，這樣速度比較快。

搜索聯系人

var Contacts = require("react-native-contacts")

Contacts.getContactsMatchingString("filter", (err, contacts) => {
  if(err === "denied"){
    // x.x
  } else {
    // Contains only contacts matching "filter"
    console.log(contacts)
  }
})

組件地址

詳細的源碼和使用說明請訪問GitHub：https://github.com/rt2zz/reac...

舉手之勞關注我的微信公眾號：ReactNative開發圈

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/89911.html

用 Vue 來寫 React 和 ReactNative

摘要：的響應核心的響應式系統是支撐整個框架運行的關鍵，也是的核心之一，官方對這個核心的分層設計得很好也是依靠其驅動原生視圖。我們日常用到的都由核心提供，對這個核心稍作修改，去掉和，意外的獲得了一個極小的響應核心，可以運行于任何標準引擎下。 showImg(https://segmentfault.com/img/bVPMZy?w=1468&h=826); GitHub: react-vue ...

maybe_009 2019-08-20 17:33 評論0 收藏0
如何使用ReactNative快速開發一個APP

摘要：鑒于我平常使用的是系統，就決定我只開發安卓客戶端，客戶端我們又招了一個小伙伴。一般來講，安卓系統是這一兩年市面上常用機型配置的系統。從去年的10月份開始，我的大部分工作重心從傳統的前端開發轉向了使用ReactNative開發APP，在這個過程當中，走過了不少彎路，也遇到了一些技術相關的問題，但總算沒有辜負那些對我信任的人。經歷過痛苦和無助，終于堅持了下來，一個月的時間把產品成功部署上...

taowen 2019-08-26 13:47 評論0 收藏0
翻譯 | 從 ReactJS 到 React-Native—兩者的主要差異是什么？

摘要：跟非常相似，但是在開始嘗試你第一個之前，也需要了解兩者之間的一些差異。推薦的方式是使用提供的。能用到組件中的或者上以啟用這個組件的觸摸事件。華翔，Web前端開發工程師著作權歸作者所有，轉載請聯系作者獲得授權。 showImg(https://segmentfault.com/img/bVUliz?w=640&h=235); React-Native已經誕生有兩年左右了，自從適配了An...

darkerXi 2019-08-21 12:05 評論0 收藏0
電影天堂React Native 客戶端V2.0發布

摘要：電影天堂客戶端重新開始具體更新以為準。重新開始兩年前發布了第一個版本。最為一名偏體驗偏設計的前端開發者，對界面和用戶體驗都有極高的重視。電影天堂React Native 客戶端重新開始！具體更新以https://github.com/XboxYan/DYTT為準。重新開始兩年前發布了第一個版本。現在，使用最新的react-native 0.57和全新的設計完成了V2.0 ...

MockingBird 2019-08-23 14:08 評論0 收藏0