React Native 动态添加屏幕

Question

我想从可变数组动态添加屏幕。

这有效：

但这不起作用： 它说：错误：找不到导航器的任何屏幕。 您是否将任何屏幕定义为其子屏幕？

如何修复第二个更“动态”？

Answer 1

您可以将components更改为对象列表。

然后通过它们的键和值在项目内循环。

const components = [
 {
   name: "Home",
   element: HomeScreen
 },
 {
   name: "Details",
   element: DetailsScreen
 }
];

const renderScreen = () => {
  let result = null;

  if (components) {
    result = components.map((item, i) => {
       return <Stack.Screen name={item.name} element={item.element} />
    });
  }

  return result;
}

return(
  {renderScreen()}
)

Answer 2

将element => { <Stack... /> }改为element => { return <Stack... /> }或element => ( <Stack... /> )