FinClip为企业提供小程序生态圈技术产品,开发者可在FinClip小程序开发帮助中心找到相关FinClip小程序指引

# ReactNative 集成

本插件提供在 ReactNative 运行环境中运行小程序能力。

# 1. 引入插件

引入小程序引擎插件。

在 package.json 文件中引入小程序 ReactNative 插件

"react-native-mopsdk": "^1.0.3"

安装插件

$ npm install react-native-mopsdk --save
$ react-native link react-native-mopsdk

# 2. 初始化引擎

import MopSDK from 'react-native-mopsdk';
// 1. 引入 NativeModules, NativeEventEmitter
import { NativeModules, NativeEventEmitter } from 'react-native';

// 2. mop初始化
const eventEmitter = new NativeEventEmitter(NativeModules.FINMopSDK);
  MopSDK.initialize({
    appkey:
      'Ev7QHvml1UcW98Y1GaLfRz34ReffbDESaTXbCoFyKhEm0a3gam0elOOOdZ6Twpa3HkBzlvOwJ2cyhOrMVWuuGw==',
    secret: '16f2d2700453ae51',
    apiServer: 'https://api.finclip.com',
    apiPrefix: '/api/v1/mop/',
    nativeEventEmitter: eventEmitter,
    finMopSDK: NativeModules.FINMopSDK,
  }).then(res => {
    console.log('初始化成功')
  }).catch(err => {
    console.log('初始化失败')
  })

# 3. 打开小程序

MopSDK.openApplet({appId: 'xxxx'});

提示

  • SDK KEY 和 SECRET 可以从社区版的管理后台中获取;
  • apiServer 为当前小程序后端的服务地址,也即前文所输入的IP:端口
  • 小程序 id 为在管理后台上架的小程序唯一ID(在小程序上架时自动生成);
  • 上述的参数可以在前文服务器部署的后台界面上获取,也可以在没有部署服务端的情况下在 FinClip 官网 (opens new window) 注册体验;
  • 重要事情说四遍,您可以在官方的 Github 仓库 (opens new window)中查看示例代码;
  • 请注意 APP 的 Bundle Id 需要与管理后台中添加的保持一致,可在【企业端-应用管理】中查看。
© 2021 凡泰极客

👋🏻 嘿,你好!

「FinClip」是一套基于云原生框架设计的小程序容器。能够让任何移动应用在集成小程序SDK之后,获得可用、安全的小程序运行能力。

>> 点我免费注册体验

查看产品文档
了解与 FinClip 相关的一切信息

产品博客 👈  了解产品更新与核心功能介绍
资源下载 👈  获取小程序 SDK 与开发工具
文档中心 👈  查询 FinClip 小程序开发指南与答疑

商务咨询热线
预约 FinClip 产品介绍,咨询商务报价或私有化部署事宜

400-066-00210755-86967467

获取产品帮助
联系 FinClip 技术顾问,获取产品资料或加入开发者社群

联系线上
人工客服

或 👉  点击这里,提交咨询工单