React Native Functional Component React - Native -select2 on

Question

React Native Functional Component React - Native -select2 onSelected Value未更新

https://www.npmjs.com/package/@schmelman rns2

https://snack.expo.dev/@prem18mca select2-functional

https://snack.expo.dev/@prem18mca select2

import React, { useState } from 'react';
import { Text, View, StyleSheet } from 'react-native';
import Constants from 'expo-constants';
import Select2 from "react-native-select-two"
// You can import from local files
import AssetExample from './components/AssetExample';
// or any pure javascript modules available in npm
import { Card } from 'react-native-paper';
export default function App() {
const [data, setData] = useState(mockData);
const mockData = [
{ id: 1, name: "React Native Developer", checked: true}, // set default checked for render option item
{ id: 2, name: "Android Developer", color: '#f00' },
{ id: 3, name: "iOS Developer", color: '#f00' }
]
return (
<View style={styles.container}>
<Text style={styles.paragraph}>
Change code in the editor and watch it change on your phone! Save to get a shareable url.
</Text>
<Select2
style={{ borderRadius: 5 }}
colorTheme="blue"
popupTitle="Select item"
title="Select item"
data={mockData}
onSelect={data => {
setData({ data })
}}
cancelButtonText = "Cancel"
selectButtonText = "Select"
onRemoveItem={data => {
setData({ data })
}}
/>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
paddingTop: Constants.statusBarHeight,
backgroundColor: '#ecf0f1',
padding: 8,
},
paragraph: {
margin: 24,
fontSize: 18,
fontWeight: 'bold',
textAlign: 'center',
},
});

Answer 1

尝试使用npm i @marcelodiegues/react-native-select2进行更新。如果不工作，显示错误信息