React Native:从功能组件导出函数

Question

>问题：

1. 我正在尝试弄清楚如何从功能组件"合同处理程序"中导出一个名为"addPostCode"的函数。

2. 我想在另一个名为"RentalDetailScreen"的功能组件中使用"addPostCode"，以便当我导航到下一页时，它将触发"addPostCode"并将"postCode"的状态存储在"ContractHandler"中。

这是"合约处理程序.js"：

import React, { useState } from 'react';
const ContractHandler = () => {
const [postCode, setPostCode] = useState();
const addPostCode = (data) => {
setPostCode(data)
console.log(postCode)
};
return(
<View>
<Text></Text>
</View>
)
}
export default ContractHandler;

这些是RentalDetailScreen的一部分.js我导航到下一页，并希望触发"addPostCode"函数并将"postCode"值发送到"ContractHandler.js"。

这是导入：

import { addPostCode } from '../../database/ContractHandler';

这是带有"addPostCode"功能的导航。

<TouchableOpacity onPress={() => { navigation.navigate('SecurityDetail'); addPostCode(postCode); }}>
<View style={slider.buttonStyle}>
<Text style={slider.textStyle}>Neste</Text>
<Ionicons name='ios-arrow-forward'style={slider.iconStyle} />
</View>
</TouchableOpacity>

"postCode"只是一个从TextInput中给出值的变量。

如果我不够清楚，请告诉我，我会尽力解释更好的:)

Answer 1

组件自身的状态不能从外部设置(从技术上讲，您可以解决它，但这不是正确的方法(。如果要在组件之间共享状态，请使用全局状态管理器 (redux( 或Context或者如果组件是同级，只需使用其公共父级来存储状态。

Answer 2

有两种方法可以解决这个问题。您可以使用像 redux 这样的状态管理器，或者您必须将函数作为 props 从一个组件传递到另一个组件。就个人而言，我会使用 redux，因为它使在组件之间共享状态变得更加简单。