我正在使用“ react-native-deck-swiper”。它没有仅用于设置顶部卡片样式的道具。我尝试使用裁判,但没有用。这是我的代码:
const Deck = ({navigation}) => {
const [currentCard, setCurrentCard] = useState(0);
let _root = React.createRef();
return (
<>
<Header title='Play' navigation={navigation}/>
<ImageBackground
resizeMode='cover'
style={{flex: 1}}
source={require('../assets/background-100.jpg')}
>
<Swiper cards={cards} backgroundColor={'transparent'}
renderCard={(card, index) => {
if(index === 0) {
return <ImageBackground resizeMode='cover'
style={{flex: 1, borderWidth: 5, borderColor: '#0003', justifyContent: 'center', alignItems: 'center'}}
source={require('../assets/background-100.jpg')}>
<Text style={styles.tutorialText}>Wischen um zur nächsten Karte zu gelangen</Text>
<Image style={styles.tutorialArrow} source={require('../assets/arrowForCard.png')}/>
</ImageBackground>
}
return <Card ref={component => _root[index] = component} style={index === currentCard ? {flex: 1, borderWidth: 5, borderColor: '#0003'} : {flex: 1}} card={card} updateDataCard={updatePopup}/>
}}
stackSize={10}
onSwiped={() => {setCurrentCard(currentCard + 1); console.log(currentCard); _root[currentCard].borderColor = '#0003'; _root[currentCard].borderWidth = 5;}}
cardStyle={{width: wp('100%'), height: '100%', marginBottom: 0}}
cardHorizontalMargin={0}
cardVerticalMargin={0}
/>
</ImageBackground>
</>
)
};
我的要求是最上面的卡片有边框。我该怎么做?使用引用是否正确?