我目前需要 React Native Navigation Problem 的幫助。我的目標是，將“用戶 ID”傳遞到我的詳細資訊螢屏，但它不起作用
包裝版本：
"@react-navigation/native": "^6.0.7",
"@react-navigation/native-stack": "^6.3.0"
我的代碼：
export default function MessagesScreen({navigation}: any) {
const [loading, setLoading] = React.useState(false);
const [messages, setMessages] = React.useState([]);
useEffect(() => {
loadChatrooms();
}, []);
const goToMessageDetail = (id: number) => {
console.log('goToMessageDetail', id);
navigation.navigate('MessageDetail', {userid: id});
};
}
export function MessageDetailScreen({navigation}: any) {
const [user, setUser] = React.useState('');
const [userid, setUserid] = React.useState('');
const [chatpartnerId, setChatpartnerId] = React.useState('');
const [message, setMessage] = React.useState('');
const [messages, setMessages] = React.useState([]);
//needs to fetch chatroom details
useEffect(() => {
**//=> I can't access the param : console.log says there is nothing**
setChatpartnerId(navigation.getParam('userid'));
}
}
導航配置
const screens = [
Messages: {
screen: MessagesScreen,
},
MessageDetail: {
screen: MessageDetailScreen,
},
]
const HomeStack = createStackNavigator(screens, {
defaultNavigationOptions: {
headerStyle: {
borderBottomWidth: 0,
elevation: 0,
shadowOpacity: 0,
height: 0,
},
headerTintColor: 'rgba(0,0,0,0.0)',
},
});
export default createAppContainer(HomeStack);
我錯過了什么嗎？我非常感謝您的幫助
uj5u.com熱心網友回復：
您訪問導航引數的方式是錯誤的。這在版本 5 中已更改react-navigation。您需要通過路由物件訪問路由引數，如下所示。
export function MessageDetailScreen({ route, navigation }) {
const { userid } = route.params; // desctructure the route params
...
}
將此行為與官方檔案中的指南進行比較。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/429493.html
標籤：javascript 打字稿 反应式 反应导航
上一篇：更新陣列而不改變它
下一篇：在React中單擊時狀態未更新