更新记录
1.0.3(2020-08-03) 下载此版本
添加加载动画
1.0.2(2020-01-08) 下载此版本
1.0.1:修复Android调取通讯时不弹授权的问题。 1.0.2: iOS联系人信息只有公司名没有姓名时读取公司名。
平台兼容性
访问原生通讯录插件使用说明
Demo链接下载:
5+App demo链接:https://github.com/w-wh/VisitContactsDemo
uni-app demo链接:https://github.com/w-wh/VisitContactsDemo_uni-app
具体实现原理可参考:
通过Native.js访问iOS原生通讯录界面(ContactsUI/AddressBookUI):https://www.jianshu.com/p/b78b02d64472
uni-app使用案例:
使用前需要先引入uni-app demo里的native.common.js文件,使用案例的代码如下:
<template>
<view class="content">
<button type="primary" style="margin-top: 200upx;" @click="visitContacts()">访问通讯录</button>
</view>
</template>
<script>
import nativeCommon from '@/utils/native.common';
export default {
data() {
return {
}
},
methods: {
visitContacts() {
nativeCommon.contacts.getContact(function(name, number){
uni.showToast({
title: name + ' ' + number,
icon: 'none'
});
});
}
}
}
</script>
<style>
.content {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
</style>
5+App使用案例:
使用前需要先引入5+App demo里的native.common.js文件,使用案例的代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title></title>
<script src="js/mui.min.js"></script>
<link href="css/mui.min.css" rel="stylesheet"/>
<script type="text/javascript" src="js/native.common.js" ></script>
<script type="text/javascript" charset="utf-8">
mui.init();
mui.plusReady(function(){
mui("button")[0].addEventListener("tap", function(){
//访问通讯录
nativeCommon.contacts.getContact(function(name, phoneNumber){
console.log("姓名/公司:"+name+",电话号码:"+phoneNumber);
mui.toast("姓名/公司:"+name+",电话号码:"+phoneNumber);
});
});
});
</script>
</head>
<body>
<header class="mui-bar mui-bar-nav">
<h1 class="mui-title">调用通讯录</h1>
</header>
<div class="mui-content">
<button type="button" style="display: block; margin: 100px auto;">访问通讯录</button>
</div>
</body>
</html>