react-native navigation.navigate 传递参数以及后面页面获取传递的参数
时间: 2023-06-25 13:07:52 浏览: 383
不同页面间的参数传递
在 React Native 中,可以使用 `navigation.navigate` 方法来实现页面的跳转,并且可以通过第二个参数来传递参数。例如:
```javascript
navigation.navigate('NextScreen', { name: 'John' });
```
在上面的例子中,我们将一个对象 `{ name: 'John' }` 作为第二个参数传递给了 `navigation.navigate` 方法。
在接收参数的页面中,可以通过 `route.params` 属性来获取传递的参数。例如:
```javascript
import React from 'react';
import { Text } from 'react-native';
function NextScreen({ route }) {
const { name } = route.params;
return <Text>Hello, {name}!</Text>;
}
export default NextScreen;
```
在上面的例子中,我们通过解构赋值的方式从 `route.params` 对象中获取了传递的 `name` 参数,并将其渲染在了页面中。
需要注意的是,如果传递的参数比较复杂,可以使用 JSON.stringify 和 JSON.parse 进行序列化和反序列化处理。
阅读全文