在React Native Swiper Tile上添加自定義元素

Question

我正在為項目使用react-native-deck-swiper，我的問題是如何向圖塊添加自定義參數，例如圖像，自定義html元素。 有沒有辦法將這些添加到紙牌陣列？

目前，紙牌陣列的結構如下：

cards: ["1","2","3"]

有沒有一種結構化方式，這樣我就可以像這樣引入自定義參數：

cards: [{name:"1", image:"imageurl", age:"43"},{name:"2", image:"imageurl", age:"22"}]

感謝您的幫助

Answer 1

您可以制作Card組件，並將數據作為道具傳遞：

const Cards = [
  { name: "1", image: "imageurl", age: "43" },
  { name: "2", image: "imageurl", age: "22" },
];

const Card = props =>
  <View>
    <Image source={props.image} />
    <Text>
      {props.name}, {props.age}
    </Text>
  </View>;

<DeckSwiper cards={Cards} renderCard={props => <Card {...props} />} />;