React native 无法在StackNavigator-React Native中显示对话框

您好，我在StackNavigator中按

headerRight

按钮时显示对话框时遇到问题。我收到一条错误消息：\u this.setState不是函数。（在_this.setState（{visible:true}）中） _此.setState未定义。这是我的密码：

state = {
  visible: false,
};

_showDialog = () => this.setState({ visible: true });

_hideDialog = () => this.setState({ visible: false });



const AppStackNavigator = createStackNavigator({
  DrawerNavigator:{
    screen: DrawerNavigator,
    navigationOptions: ({navigation}) => ({
      title: 'Fabiola Voyance',
      headerTintColor: 'white',
      headerStyle: {
        backgroundColor: '#8cc866',
      },
      headerMode: 'none',
      headerLeft: (
            <TouchableOpacity style={{marginLeft: 10 }} onPress={ () =>{ navigation.openDrawer()}}>
                <Icon color="white" name="menu" size={30}  />
            </TouchableOpacity>
        ),
    }),
  },
    Accueil: {
    screen: Accueil,
    navigationOptions: {
      title: 'Horoscope',
      headerTintColor: 'white',
      headerStyle: {
        backgroundColor: '#8cc866',
      },
    },
  },
  VoyanteProfil: {
    screen: VoyanteProfil,
    navigationOptions: (navigation) => ({
      headerTintColor: 'white',
      headerStyle: {
        backgroundColor: '#8cc866'
      },
      headerMode: 'none',
      headerRight: (
        <TouchableOpacity onPress = {() => {this._showDialog()} }>
          <View style={{borderRadius: 30, overflow: 'hidden', alignItems: 'center',backgroundColor:'white', justifyContent: 'center', marginRight:20 }}>
            <Image style={{ width:35, height: 35 }} source={require("../Images/icone-sonnerie.png")}/>
            <Dialog
                animationType =  "fade"
                contentStyle= {
                  {
                    alignItems:"center",
                    justifyContent:"center",
                  }
                }
                visible={this.state.visible}
                onDismiss={this._hideDialog}>
                <View>
                  <Text style = {{textAlign: 'center', fontSize:18}}>La Voyance Privée offre une consultation sans attentes, sans limite de temps et sans interruption</Text>
                </View>
                <View style = {{marginTop:15,marginBottom:15}}>
                  <MyButton style={{}} text={"Voyance privée\nouvert 24h/24\n"} icone='icone-transfert'/>
                </View>
                <View>
                  <Text style = {{textAlign:'center', fontSize:18}}>La Voyance Directe sans CB permet de choisir un des Médiums présents sur le moment</Text>
                </View>
                <View style = {{marginTop:15,marginBottom:15}}>
                  <MyButton text={"Voyance sans CB\nouvert 24h/24\n"} icone='icone-sonnerie'/>
                </View>

            </Dialog>
         </View>
         </TouchableOpacity>
      )
    }),
  },

状态={
可见：假，
};
_showDialog=（）=>this.setState（{visible:true}）；
_hideDialog=（）=>this.setState（{visible:false}）；
const AppStackNavigator=createStackNavigator({
付款人：{
屏幕：抽屉式显示器，
导航选项：（{navigation}）=>({
标题：“Fabiola Voyance”，
头部颜色：“白色”，
头型：{
背景颜色：“#8cc866”，
},
headerMode:“无”，
左校长：(
{navigation.openDrawer（）}}>
),
}),
},
准确地说：{
屏幕：Accueil，
导航选项：{
标题：“占星术”，
头部颜色：“白色”，
头型：{
背景颜色：“#8cc866”，
},
},
},
VoyanteProfil：{
屏幕：VoyanteProfil，
导航选项：（导航）=>({
头部颜色：“白色”，
头型：{
背景颜色：“#8cc866”
},
headerMode:“无”，
头灯：(
{this.\u showDialog（）}}>
无需出席、无需临时限制、无需中断的咨询服务私人顾问
无CB董事会会议记录的临时会议记录
)
}),
},

您不能在类组件之外使用状态。您能解释一下您想做什么吗？我想在标题选项卡中有一个按钮，当我点击这个按钮时，我想显示一个对话框，里面还有两个按钮。那么我如何从其他组件访问状态？