antd mobile Picker 输入框选择

Antd Mobile Picker 是一个移动端的选择器组件，可以用于从一组选项中选择一个或多个值。

使用 Picker 组件，需要先引入相应的样式文件和组件，并通过 data 属性传入选项的数据。Picker 组件有多种模式可供选择，常见的有单列选择、多列选择和级联选择。

以下是一个使用单列选择模式的示例代码：

import { Picker } from 'antd-mobile';

const data = [
  { value: 'apple', label: 'Apple' },
  { value: 'banana', label: 'Banana' },
  { value: 'orange', label: 'Orange' },
  { value: 'pear', label: 'Pear' },
];

function onChange(value) {
  console.log(value);
}

function Example() {
  return (
    <Picker
      data={data}
      title="Select Fruit"
      cascade={false}
      value={['apple']}
      onChange={onChange}
    >
      <List.Item arrow="horizontal">Fruit</List.Item>
    </Picker>
  );
}

export default Example;

在上面的代码中，我们引入了 Picker 组件，并定义了一个包含水果选项的数组 data。然后，在 Example 组件中，我们将 Picker 组件包裹在 List.Item 组件中，并通过 data 属性将选项传入 Picker 组件。通过 title 属性可以设置选择器的标题，cascade 属性用于设置是否启用级联选择，value 属性设置默认选中的值，onChange 属性设置值发生变化时的回调函数。

以上是一个简单的 Picker 输入框选择的示例，你可以根据自己的需求调整相应的参数和样式