推荐开源项目:React Native Radio Buttons
React Native Radio Buttons 是一个用于 React Native 应用程序的自定义单选按钮组件。以下是如何使用该项目的简要说明:
- 首先,确保你的 React Native 环境已经设置好,并且你可以运行一个基本的应用。
- 使用 npm 或 yarn 安装
react-native-radio-buttons
包:
npm install react-native-radio-buttons
# 或者
yarn add react-native-radio-buttons
- 在你的 React Native 应用程序中导入并使用 RadioButtons 组件。
示例代码:
import React, { useState } from 'react';
import { View, Text } from 'react-native';
import RadioButtons from 'react-native-radio-buttons';
const App = () => {
const [selectedIndex, setSelectedIndex] = useState(0);
const onSelect = (index, value) => {
setSelectedIndex(index);
};
return (
<View>
<RadioButtons
data={[
{ label: 'Option 1', value: '1' },
{ label: 'Option 2', value: '2' },
{ label: 'Option 3', value: '3' },
]}
selectedIndex={selectedIndex}
onSelect={onSelect}
/>
<Text>Selected Option: {selectedIndex + 1}</Text>
</View>
);
};
export default App;
在这个例子中,我们创建了一个简单的应用程序,展示了如何使用 RadioButtons 组件。我们定义了一个选项列表,并在用户选择一个选项时更新了 selectedIndex
状态。然后,我们在屏幕上显示了被选择的选项。
评论已关闭