使用 this.setState() 时无法访问 React-native Protected 成员答案

【问题标题】：React-native Protected member is not accessible when using this.setState()使用 this.setState() 时无法访问 React-native Protected 成员
【发布时间】：2018-01-23 03:54:18
【问题描述】：

我是原生反应的新手。请帮助解决这个问题。我哪里错了？请指出并纠正我..非常感谢您

import React, {Component} from 'react';
import {Alert,View,Image} from 'react-native';
import ImagePicker from 'react-native-image-picker';
import {Button} from "../components/common";

class ImageSelect extends Component {
    constructor(props) {
        super(props);
    }

    state = {
        ImageSource: null,
        imageBase: null,
        whichScreen: null,
    };


    showPicker() {
        const options = {
            quality: 1.0,
            maxWidth: 500,
            maxHeight: 500,
            storageOptions: {
                skipBackup: true,
                path: 'images'
            }
        };

        ImagePicker.showImagePicker(options, (response) => {
            console.log('Response = ', response);

            if (response.didCancel) {
                console.log('User cancelled image picker');
            }
            else if (response.error) {
                console.log('ImagePicker Error: ', response.error);
            }
            else if (response.customButton) {
                console.log('User tapped custom button: ', response.customButton);
            }
            else {
                let source = {uri: response.uri};

                // You can also display the image using data:
                // let source = { uri: 'data:image/jpeg;base64,' + response.data };

                Alert.alert(source);
                this.setState({
                    imageSource: source
                });
            }
        });
    };

    showAlert(){
        Alert.alert("Picked");
    }

    render() {
        return (
            <View>
                <Button
                    buttonText={"Pick"}
                    onPress={this.showPicker.bind(this)}
                />
                <Image
                    source={this.state.imageSource}
                    style={{width: 50, height: 50,}}
                />
            </View>
        );
    }
}

export default ImageSelect;

我想使用现有库 Image Picker 选择图像.. 我需要将源保存到状态，但它说 Protected Member is not access 。请指出我哪里错了？

【问题讨论】：

你没有调用showPicker 方法。那么这个错误是怎么出现的呢？
我也不知道这个错误是怎么出现的？
点击button时出现此错误？
对于遇到困难的人来说，如果可以选择重命名组件，则可以这样做。在图书馆的某个地方，那个家伙还有另一个 ImageSelect 组件，当 WebStorm 出错时就是这种情况。

标签： react-native protected setstate

【解决方案1】：

你必须在构造函数中声明状态变量。

constructor(props) {
super(props);
this.showPicker = this.showPicker.bind(this);
this.state = {
  imageSource : null,
}
}

另外，Button 中的 onPress{} 方法是空的，如果你想调用它，你需要在 onPress{} 中调用 showPicker() 函数。

【讨论】：

我已经编辑了我的代码..请查看它并感谢您的回复先生。
兄弟，你需要在构造函数中添加你的状态变量，就像我发布的上面的代码一样。
请更新您的代码，并像这样调用onPress={this.showPicker}
我得到了错误：当 this.setState({ imageSource: source }); IDE 说。受保护的成员不可访问
我在 Webstorm 2018.1 上也遇到了这个错误，以前没有发生过。我有数百个我确信正确使用 this.setState() 的 js 文件，并在必要时在构造函数中绑定。