無法使用 getderivedstatefromprops 從帶有搜索欄的道具執行反應狀態更新

Question

我只是想知道你能不能幫我解決這個問題。 我想使用getderivedstatefromprops從道具更新狀態。 但問題是我在這個文件中還有一個搜索欄，它正在使用當地狀態進行研究。 我的道具用 redux 更新，但我無法更新狀態。 並且由於componentWillReceiveProps已被棄用，因此不建議使用它。

這是我的代碼的一小部分：

class modification extends React.Component {

    constructor(props) {
        super(props)
        this.state = {
            cle: this.props.cle,
            nom_shotgun: this.props.nom_shotgun,
            date_shotgun: this.props.date_shotgun,
            photo_shotgun: this.props.photo_shotgun,
            etat: this.props.etat,
            admin: this.props.admin,
            error: null,
            searchValue: "",
            data: this.props.data,
            loading: false,
        };
        this.arrayholder = this.props.data;
    }

    searchFunction = (text) => {
        const updatedData = this.arrayholder.filter((item) => {
            const item_data = `${item.nom_shotgun.toUpperCase()})`;
            const text_data = text.toUpperCase();
            return item_data.indexOf(text_data) > -1;
        });
        this.setState({ data: updatedData, searchValue: text });

    };

    static getDerivedStateFromProps(props, state) {
        if (props.data !== state.data) {
            return { data: props.data };
        }
        return null
    }

    render() {
        const Item = ({ nom_shotgun, cle, photo_shotgun, date_shotgun, etat, admin }) => {
            const handlerLongClick = () => {

                Alert.alert(
                    "Alert",
                    "Supprimer le shotgun?",
                    [
                        { text: "oui", onPress: () => this._supprimer(cle) },
                        { text: "non", onPress: () => console.log("no Pressed") }
                    ]
                );
            };
        }

        const renderItem = ({ item }) => <Item
          nom_shotgun={item.nom_shotgun}
          cle={item.cle}
          photo_shotgun={item.photo_shotgun}
          date_shotgun={item.date_shotgun}
          etat={item.etat}
          admin={item.admin}
        />;
        return (
            <View>
                <TouchableOpacity style={styles.item} onPress={() => this._navigation(etat, admin)} onLongPress={handlerLongClick}>
                    <View>
                        <Text style={styles.nom_shotgun}>{nom_shotgun}</Text>
                        <Text style={styles.date_shotgun}>{date_shotgun}</Text>
                        {this._admin(admin)}
                        <Text style={styles.etat}> {etat} </Text>
                        <Image
                            style={styles.photo_shotgun}
                            source={require('../image/shotgun2.png')}
                        />
                        <Divider style={{ height: 1 }} />
                    </View>
                </TouchableOpacity>
            </View>
        );
    };
}

歡迎任何建議，謝謝！

Answer 1

函數getDerivedStateFromProps不起作用？

也許使用shouldComponentUpdate ？