前言
随着移动设备和智能手机的普及，短信功能也愈加重要。在 React Native 的应用开发过程中，如何实现短信验证码功能呢？ 这时候，我们就可以用到一个 npm 包，即 react-native-sms-sdk。本篇教程将介绍该 npm 包的使用方法。
安装
我们可以使用 npm 安装该包：
npm install react-native-sms-sdk --save
安装完成后，我们需要进行一些配置。
Android 配置
在 node_modules/react-native-sms-sdk/android/app/src/main 下的 AndroidManifest.xml 中添加以下权限：
<uses-permission android:name="android.permission.RECEIVE_SMS"/> <uses-permission android:name="android.permission.READ_PHONE_STATE"/> <uses-permission android:name="android.permission.READ_SMS"/> <uses-permission android:name="android.permission.SEND_SMS"/> <uses-permission android:name="android.permission.WRITE_SMS"/>
iOS 配置
进入 Xcode，找到项目的 Info.plist 文件，添加以下权限：
<key>NSMicrophoneUsageDescription</key> <string>该 App 需要获取您的短信</string> <key>NSAppleMusicUsageDescription</key> <string>该 App 需要您同意短信请求</string>
使用
在需要使用的页面中，我们先引入 react-native-sms-sdk：
import SmsSdk from 'react-native-sms-sdk';
我们可以用 SmsSdk.getID() 获取当前的设备 ID，用于验证短信是否发送到指定设备上：
SmsSdk.getID((error, deviceId) => {
if (error) {
console.error(error);
return;
}
console.log(deviceId);
});接下来，我们可以用 SmsSdk.send() 发送短信。该方法接收三个参数：目标手机号、验证码和回调函数。
SmsSdk.send('13000000000', '123456', (error, callback) => {
if (error) {
console.error(error);
return;
}
console.log(callback);
});实例
我们以一个登录页为例子，展示如何使用 react-native-sms-sdk。
-- -------------------- ---- -------
------ ------ - -------- - ---- --------
------ - ----- ---------- ------- ---- - ---- ---------------
------ ------ ---- -----------------------
----- ----- - -- -- -
----- ------------- --------------- - -------------
----- ------ -------- - -------------
----- ---------- ------------ - -------------
----- --------- ----------- - -------------
----- ---------- - -- -- -
-------------------- --------- -- -
-- ------- -
---------------------
-------
-
----------------------
------------------------ --------- ------- --------- -- -
-- ------- -
---------------------
-------
-
------------------- -----------------------
---
---
--
----- ----------- - -- -- -
-- -------------- -
---------------------
-------
-
-- ------- -
---------------------
-------
-
-- ----------- -
-------------- -- ------
-------
-
-- -----------
-- ----
--
------ -
------
----------
-------- ------------ ------- ------------ - --
--------------------
------------------------
-------------------
-----------------------------
--
------- ------------- -------------------- --
----------
-------- ------------ ------- ------------ - --
-------------------------
-------------------------
------------
----------------------
--
------- ---------- --------------------- --
-------- - ---------------------- - -----
-------
--
--
------ ------- ------总结
我们在这篇文章中介绍了如何使用 npm 包 react-native-sms-sdk，在 React Native 应用中实现短信验证码功能。通过了解 react-native-sms-sdk ，您可以更加方便地实现短信功能，提升应用的用户体验。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005580981e8991b448d52df