主页 / 问题 / 1606218
Accepted
Enchanting witch
Asked:2025-02-04 14:51:45 +0000 UTC2025-02-04 14:51:45 +0000 UTC

如何通过 ReactNative、expo 的值传递来组织屏幕表单之间的转换

  • 772

我正在尝试通过传输对象 ID 值从一个屏幕形式 (/(tabs)/structure) 转换到另一个屏幕形式 (/structures/system)。应用程序堆栈声明文件夹（选项卡）和结构。

（标签）/_layout.tsx

import React from 'react';
import { Tabs } from 'expo-router';

export default function TabLayout() {

  return (
    <Tabs>
      <Tabs.Screen
        name="structure"
      />

    </Tabs>
  )
}

结构/_layout.tsx

import React from 'react';
import { Stack } from 'expo-router';

export default function TabLayout() {
  return (

    <Stack>
      <Stack.Screen
        name="system"
        initialParams={{ idSystem: 1 }}
        }}
      />
    </Stack>
  )
}

在 的帮助下router.push('/structures/system')，转换工作正常，但据我了解，它不允许传输必要的值，因此我尝试在navigation.navigate('structures', {screen: 'system'}, {idSystem: item.id})- 的帮助下组织它。转换已执行，但出现以下错误：

（NOBRIDGE）错误警告：TypeError：无法读取未定义的属性“params”

结构/系统.tsx

import { ScrollView } from 'react-native';
import { router, useNavigation } from 'expo-router';

export default function TabOneScreen({route}: any) {
  const navigation = useNavigation();
  const {idSystem} = route.params;
  console.log(idSystem);

  return (
    <ScrollView >
    //smth
    </ScrollView>
  );
}

如果您写的是 TabOneScreen(idSystem: any) 而不是 TabOneScreen({route}: any)，它会产生以下内容作为 idSystem 值的控制台输出：

{“段”：“系统”}

告诉我问题出在哪里，如何正确组织过渡与价值转移？

javascript

1 个回答

  1. Best Answer

    找到了一个详细的例子https://expo.github.io/router/docs/migration/react-navigation/params/

    结构.tsx

    export default const Struct = () => {
const router = useRouter();// from 'expo-router'
 return(
    <TouchableOpacity onPress={() =>{router.push({pathname: '/structures/system', params: { post: item.id}})}} style={{width: '99%'}}>
       //smth
    </TouchableOpacity>
);
}

    系统.tsx

    export default function TabOneScreen() {
  const {post} = useLocalSearchParams();
  console.log(post);

  useEffect(() => {
    if (post) {
      // Post updated, do something with `post`
      // For example, send the post to the server
    }
  }, [post]);

return (
//smth
);
}
    • 1

相关问题