时间戳

首页 > 解决方案 > 如何设置复选框以在本机反应中使用任意存储

javascript - 如何设置复选框以在本机反应中使用任意存储

问题描述

我正在整理一个复选框，它将数据推送到本机反应的异步存储中，但在获取数据时遇到了麻烦。我已经设置了该功能，大概是在选中该框然后未选中该框时将数据推送到存储中。下面是代码，似乎取消选中该框不会粘住。当我再次打开应用程序时，该框仍处于选中状态，我在这里可能做错了什么？假设现在存储的本地项目是true并且我想在取消选中时将其设为假。为了确认没有任何变化，我添加了一个按钮来调用数据。

    const STORAGE_KEY = '@save_enableauto'
        state={
            enableAuto:false
        }

      _storeData = async enableAuto => {
            let x = enableAuto;
            console.log('setting auto messages to: ', !x);
            //send check box to state
            this.setState({ enableAuto: !x });

            try {

              if(x) {
                await AsyncStorage.setItem(STORAGE_KEY, 'true')
                alert('Data successfully saved!')
              } else {
                await AsyncStorage.setItem(STORAGE_KEY, 'false')
              }

            } catch (e) {
                console.log(e)
              alert('Failed to save name.')
            }
          }

        _retrieveData = async () => {
            try {
              const enableAuto = await AsyncStorage.getItem(STORAGE_KEY);
              if (enableAuto !== null) {
                // We have data!!
                console.log('receiving from local storage: ',enableAuto);
                this.setState({ enableAuto:eval(enableAuto) });
              }
            } catch (error) {
                alert('failed to load previous settings.')
              // Error retrieving data
            }
        };

        componentDidMount() {
            this._retrieveData()
          }


    ....

<Button title={'call Data'} onPress={() => this._retrieveData()}/>
    <CheckBox
                                    value={this.state.enableAuto}
                                    onValueChange={() => this._storeData(this.state.enableAuto)}
                                />

标签： javascriptreact-nativelocal-storageasyncstorage

解决方案

将 _storeData 调用更新为：

<CheckBox value={this.state.enableAuto}
               onValueChange={() => this._storeData(!this.state.enableAuto)}
     />

和你的功能体：

_storeData = async enableAuto => {
        let x = enableAuto;
        console.log('setting auto messages to: ', x);
        //send check box to state
        this.setState({ enableAuto: x });
        ...
    }

推荐阅读