组件微调不工作

我创建了一个组件调用微调这样：在这个组件微调不工作

//spinner.js

import React, { Component } from 'react'; 

import { 
    Image, 
    StyleSheet, 
    View, 
    Text, 
    KeyboardAvoidingView, 
    TouchableHighlight, 
    Modal, 
    Button, 
    ActivityIndicator, 
} from 'react-native'; 

export default class Spinner extends Component{ 

constructor(props){ 
    super(props); 
    this.state={ 
     visible:this.props.visible 
    }; 
    this._show=this._show.bind(this); 
    this._hide=this._hide.bind(this); 
} 

render(){ 
    return(
     <Modal 
      animationType={'none'} 
      transparent={true} 
      visible={this.state.visible} 
      onRequestClose={this.props.onDismissLoadingCallback}> 
      <View style={{flex:1}}/> 
      <View style={{ 
       height:80, 
       width:80, 
       alignItems:'center', 
       justifyContent:'center', 
       backgroundColor:'#3434347f', 
       borderRadius:10,alignSelf:'center'}}> 
       <ActivityIndicator 
        animating={true} 
        size={"large"} 
        color={'white'} 
       /> 
      </View> 
      <View style={{flex:1}}/> 
     </Modal> 
    ); 
} 
_show() { 
this.setState({visible:true}); 
} 

_hide(){ 
this.setState({visible:false}); 
} 
}

创建方法_show（）和_hide（）

但没有当我从其他班级打电话时，我从班级Login.js致电

class Login extends Component { 
    constructor(props) { 
     super(props) 
     this.state = { visible: false }; 
    } 

_onLoginPress() { 
     this.Spinner._show() 
      ) 
    } 

_redirect() { 
     this.Spinner._hide() 
    } 
     render() { 
       return (
     <Spinner visible= {this.state.visible}/> 
     <TouchableHighlight style={styles.button} 
        onPress={this._onLoginPress} 
        activeOpacity={1} > 
      <Text style={styles.textButtonLogin}>Visible</Text> 
      </TouchableHighlight> 

      <TouchableHighlight style={styles.button} 
        onPress={this._redirect} 
        activeOpacity={1} > 
      <Text style={styles.textButtonLogin}>Not Visible</Text> 
      </TouchableHighlight> 

) 
}

当在构造函数中设置true时，如果显示，但在构造函数中设置为false时，它不显示，它可以显示何时按下按钮_onLoginPress，而不显示何时按下按钮_redirect（）。

来源

2017-09-06 MARTIN ALBARRACIN

为什么不直接将“可见”道具传递给Spinner组件中的模态，并且在Login组件中更新可见状态而不是调用show和hide？通常情况下最好避免在可以使用时使用ref，而使用state和peops。 –

对于正确使用<Spinner />参考，你必须

<Spinner ref={(ref) => this.Spinner = ref} visible= {this.state.visible} />

然后你this.Spinner._show()，this.Spinner._hide()应该工作。

来源

2017-09-06 03:29:34 Val

组件微调不工作

回答

相关问题