React Native 更改 let 值不会在子组件中更改为道具

Posted 2023-03-13

【中文标题】React Native 更改 let 值不会在子组件中更改为道具

【英文标题】：React Native changing let value does not get changed in child component as props

【发布时间】：2019-05-25 10:41:54

【问题描述】：

嘿，我有点卡在这个问题上。整个问题是我不能在 navigationOptions 中使用状态。所以我尝试了这个：

我声明我让let isFilterVisible: boolean = false;

有一个 navigationOptions 块，我在 onPress 事件中调用函数。

static navigationOptions = ( navigation : NavigationInjectedProps) => (
    headerRight: (
            <FilterButton onPress=() => Installations.handleFilterVisibility(isfilterVisibile)/>
   ),
);

我处理值的简单 static 函数

static handleFilterVisibility(filterVisibility: boolean)
    isfilterVisibile = !filterVisibility;

然后它作为道具传递给孩子

<Filter isFilterVisible=isfilterVisibile/>

一切似乎都很好，但是当我尝试在子组件中记录道具时。

ComponentDidUpdate 甚至 ComponentWillReceiveProps 也不会记录任何内容。

有什么想法可能是错误的吗？

【问题讨论】：

这些函数以小写c开头；有没有可能因为你有ComponentDidUpdate，他们一开始就没有被叫到？

最好提供整个代码sn-p。

是的，尝试在codesandbox.io上创建minimal reproducible example。

@ChrisG 只是我的错字。它在代码中是小写的。关于codesanbox。想试试，但我的项目真的很复杂，很难将它复制到 sanbox。

不要复制整个项目。您需要创建一个重现问题的最小示例。 （这是让人们调试代码的技巧）

【参考方案1】：

所以最后我解决了这个感谢导航params，解决方案：

static navigationOptions = ( navigation : NavigationInjectedProps) => (
    headerRight: (
            <FilterButton onPress=() => 
                const params =  = navigation.state;
                params.handleFilterVisibility()
            />
    ),
);

handleFilterVisibility = () => 
    const  isFilterVisible  = this.state;
    const  navigation  = this.props;
    this.setState(isFilterVisible: !isFilterVisible, () => 
        navigation.setParams( 
            isFilterVisible
        );
    )


componentDidMount() 
    const  navigation  = this.props;
    const  isFilterVisible  = this.state;
    navigation.setParams(
        handleFilterVisibility: this.handleFilterVisibility,
        isFilterVisible
    );