Package Exports

react-native-arenakit

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-native-arenakit) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-native-arenakit使用说明

react-native-arenakit 是提供给arena宿主容器的一个UI及功能库，集成了一些基础组件提供给业务端使用, 且提供了api调用能力，方面业务端调试，目前仅能支持iOS端调用能力。

业务团队集成：

1. npm install react-native-arenakit --save

添加依赖至原生项目
2. react-native link react-native-arenakit

宿主集成：

安卓：使用jitpack第三方管理工具集成，可自行搜索如何添加jitpack配置，配置完成后直接在模块的dependencies中配置compile 'com.github.chenyunjie:RNArenaKit:2.0.1' 暂时使用私人github，后续更换，依赖添加完成后添加ReactPackage, RNArenaKit的Pakcage名字为RNArenaKitPackage，将其添加到package管理中去。

iOS：ios宿主中使用了package.json来管理依赖，在package.json中添加 react-native-arenakit npm依赖并执行 npm i 安装，然后将依赖文件中的 node_modules/react-native-arenakit/ios/libRNArenaKit.a添加至依赖，注意使用相对路径的方式，而不是直接拷贝到工程，方便版本更新到控制

组件说明

Selection

点选组件，支持多选，单选

<Selection dataSource={this.state.dataSource} 
           itemLabel={(item) => item["name"]} 
           horizontalGap={10}/>

参数	必选	类型	默认值	描述
selectedIndex	否	number		当前选中值索引
selectedItem	否	object		当前选中对象
selectable	否	boolean		是否可选
selectableOnEmpty	否	boolean		当前组件如果未选择且selectable为false时是否可选
itemRender	否	function(item, index, selected)		渲染函数
multiple	否	boolean	true	是否多选
dataSource	是	array	[]	数据源
itemStyle	否	object	{}	每个选项的样式
itemLabel	否	function(item):string		选项展示文字函数，默认直接取值
horizontalGap	否	number	0	横向间距
verticalGap	否	number	0	纵向间距
onChange	否	function(item, index, selected)		选中值发生变化时调用

DateTimePicker

日期选择组件，支持时间、日期、日期+时间

Picker

上拉选择组件，此组件为API调用方式使用,非UI组件。

Picker.init({
    pickerData: ["男", "女"],
    onPickerConfirm: data => {
        console.log("选中了：" + data);
    }
});
Picker.show()

具体参数及使用方式参考 react-native-picker

Swiper

滑动组件参考 react-native-swiper 使用方式

关于运行时环境使用

运行时环境仅支持iOS平台使用，且使用时必须结合cocoapods使用.

cocoapods安装： gem install cocoapods

使用方式：

新建项目 react-native init Demo
进入项目的ios目录使用 pod init 初始化依赖配置文件
配置当前微应用所使用到的arena api依赖，如：
在ios目录下执行 pod install 安装依赖的api组件

安装完成后就可以直接调试arena支持的原生api了