npm package: @ohmi/rmc-picker
Description: React Mobile Picker Component(web and react-native)
Latest version: 5.0.6-rc-0.2

> 模板版本：v0.2.0

<p align="center">
  <h1 align="center"> <code> @ohmi/rmc-picker</code> </h1>
</p>
<p align="center">
    <a href="https://github.com/react-component/m-picker">
        <img src="https://img.shields.io/badge/platforms-android%20|%20ios%20|%20harmony%20-lightgrey.svg" alt="Supported platforms" />
    </a>
    <a href="https://github.com/react-component/m-picker/issues">
        <img src="https://img.shields.io/badge/license-MIT-green.svg" alt="License" />
        <!-- <img src="https://img.shields.io/badge/license-Apache-blue.svg" alt="License" /> -->
    </a>
</p>

本项目基于 [rmc-picker@5.0.5](https://github.com/react-component/m-picker) 开发。
> [!TIP] [Gitee 地址](https://gitee.com/kunyuan-hongke/rmc-picker)

## 安装与使用

请到三方库的 发行版 发布地址查看配套的版本信息：[rmc-picker Releases](https://gitee.com/kunyuan-hongke/rmc-picker),下载tgz包

进入到工程目录并输入以下命令：



<!-- tabs:start -->

#### **npm**

```bash
npm install @ohmi/rmc-picker
```

#### **yarn**

```bash
yarn add @ohmi/rmc-picker
```

<!-- tabs:end -->

下面的代码展示了这个库的基本使用场景：

>[!WARNING] 使用时 import 的库名不变。

```js
import MultiPicker from 'rmc-picker'
import Picker from 'rmc-picker'
import React, { useState } from 'react';
import {  View } from 'react-native';
export default function MultiPickers() {

      const [multiPickervalues, setmultiPickervalues] = useState('value:one');

    const onChange = ((value) => {
        setMultiPickerValues(value)
    })

  return (
     <View style={styles.container}>
                        <MultiPicker
                            selectedValue={multiPickervalues}
                            onValueChange={onChange}
                        >
                            <Picker.Item className="my-picker-view-item" value="value:one">one</Picker.Item>
                            <Picker.Item className="my-picker-view-item" value="value:two">two</Picker.Item>
                            <Picker.Item className="my-picker-view-item" value="value:three">three</Picker.Item>
                        </MultiPicker >
                        <Picker indicatorClassName="my-picker-indicator" itemStyle={{backgroundColor:'gray',fontWeight:'900',color:'green'}}>
                            <Picker.Item className="my-picker-view-item" value="picker1">one</Picker.Item>
                            <Picker.Item className="my-picker-view-item" value="picker2">two</Picker.Item>
                            <Picker.Item className="my-picker-view-item" value="picker3">three</Picker.Item>
                        </Picker>
    </View>
  );
}

const styles = StyleSheet.create({
 container: {
        justifyContent: 'center',
        alignItems: 'center',
        paddingTop: 40,
        
    },
});
```


## API
# MultiPicker props
> [!TIP] "Platform"列表示该属性在原三方库上支持的平台。

> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。

|        Name         | Description  |   type   | Required | Platform | HarmonyOS Support |
| :-----------------: | :----------: | :------: | :------: | :---------------: | :---------------: |
|  classNameweb | 根dom节点的附加css类    |    String    | NO  |   web    |    NO    |
|  prefixCls | 如果选中此选项，KDM将显示可用命令行选项的列表.prefix类   |    String     | NO  |   web    |    NO    |
|  defaultSelectedValue | 列出存档默认选定值   |    string[]/number[]      | NO  |   web   |    NO    |
|  selectedValue |筛选器当前选定的值   |    string[]/number[]       | NO  |   Android/ios    |    yes    |
|  onValueChange |  筛选器选定值回调方法  |    Function(value)      | NO  |   Android/ios    |    yes    |

# Picker props
> [!TIP] "Platform"列表示该属性在原三方库上支持的平台。

> [!TIP] "HarmonyOS Support"列为 yes 表示 HarmonyOS 平台支持该属性；no 则表示不支持；partially 表示部分支持。使用方法跨平台一致，效果对标 iOS 或 Android 的效果。

|        Name         | Description  |   type   | Required | Platform | HarmonyOS Support |
| :-----------------: | :----------: | :------: | :------: | :---------------: | :---------------: |
|  classNameweb | 根dom节点的附加css类    |    String    | NO  |   web    |    NO    |
|  prefixCls | 如果选中此选项，KDM将显示可用命令行选项的列表.prefix类   |    String     | NO  |   web    |    NO    |
|  defaultSelectedValue | T列出存档默认选定值   |    string[]/number[]      | NO  |   web   |    NO    |
|  selectedValue |筛选器当前选定的值   |    string[]/number[]       | NO  |   Android/ios    |    yes    |
|  onValueChange |  筛选器选定值回调方法  |    Function(value)      | NO  |   Android/ios    |    yes    |
|  disabled | 禁用选择器   |   bool      | NO  |   NO   |    NO    |
|  indicatorClassName |class指标名称   |    string       | NO  |  web   |    NO    |
|  indicatorStyle |  筛选器选定指示器样式值回调方法  |    object     | NO  |   web    |    NO    |
|  itemStyle |  选择器子项样式  |    object     | NO  |   Android/ios    |    yes    |
## 遗留问题

## 其他

## 开源协议

本项目基于 [The MIT License (MIT)](https://github.com/react-component/m-picker/blob/master/README.md) ，请自由地享受和参与开源。