如何将 React Native 组件作为 JSON 对象传递

Question

我想在我的 React Native 应用程序中使用 react-native-intro-slider 将介绍页面制作成滑块。我已经将页面实现为反应功能组件（我可以在其中导入它们并使用，ex:-）。但似乎反应本机滑块将 json 对象数组作为输入。

例如：-

const slides = [
  {
    key: 1,
    title: 'Title 1',
    text: 'Description.\nSay something cool',
    image: require('./assets/1.jpg'),
    backgroundColor: '#59b2ab',
  },
  {
    key: 2,
    title: 'Title 2',
    text: 'Other cool stuff',
    image: require('./assets/2.jpg'),
    backgroundColor: '#febe29',
  },
  {
    key: 3,
    title: 'Rocket guy',
    text: 'I\'m already out of descriptions\n\nLorem ipsum bla bla bla',
    image: require('./assets/3.jpg'),
    backgroundColor: '#22bcb5',
  }
];

我想将已经创建的页面（功能组件）作为输入数组传递，而不是上面的 json 个对象。类似于下面的代码：

const slides = [
  {
    key: 1,
    <Page 1/>
  },
  {
    key: 2,
    <Page2 />
  },
  {
    key: 3,
    <Page3 />
  }
];

请问我该怎么做？

Answer 1

这不是他们 API 的一部分。但我想你可以在 renderItem 函数中切换组件。

const slides = ["1", "2"];

const renderItem = ({ item }) => {
  switch(item) {
    case "1": return <Page1 />;
  }
};

如何将 React Native 组件作为 JSON 对象传递

How to pass React Native Component as a JSON object

javascript

arrays

json

react-native