Анимированные в реакции нативные не увеличивающие высоту компонентов - PullRequest
Новая
       16

Анимированные в реакции нативные не увеличивающие высоту компонентов

0 голосов
/ 22 января 2019

У меня есть этот компонент.В этом я хочу, чтобы высота компонента увеличилась, когда я получил ошибку от вызова Axios.Я ловлю ошибку в axios и там я использую Animated (...). Start ()Я получаю ошибку, а затем я использую Animated (...). Start () , но он не работает. 

import ... 


class Box extends Component{
    constructor(props){
        super(props)
        this.state = {
            boxHeight:new Animated.Value(0.01)
        }
        this.onSetCompany = this.onSetCompany.bind(this)
    }
    onSetCompany(data){ 
            axios.post(`${ip}api/check`,this.props.data)
                        .then((res)=>{
            this.props.navigation.navigate('dta')
            }).catch((e)=>{
                console.log('err')
                if(e){
                     Animated.spring(this.state.boxHeight, {
                                        toValue: 200,
                                    }).start();
                }
            })
    }
    render(){
        return(
            <View style={style.outerBox}>
                <View style={style.box}>
                    <View style={[style.date,{alignItems:'center'}]}>
                    <Text style={{textAlign:'center',fontSize:12,color:'#F11ABD'}}>{day[date.getDay()]}</Text>
                    </View> 
                    <TouchableOpacity style={style.details} onPress={()=>this.onSetCompany(this.props.data.c)}>
                        <Text style={style.cm}>{this.props.data.c}</Text>
                     </TouchableOpacity>
                    </View>
                        <Animated.View              //this should increase
                            style={{
                                backgroundColor:'#000',
                                height: this.state.boxHeight,
                            }}
                        >
                            <View style={{backgroundColor:'#000'}}>
                                <Text>You have error</Text>
                            </View>
                        </Animated.View>
                </View>
        )
    }
}

export default withNavigation(Box);


var style = StyleSheet.create({
    date:{
        width:100,
        height:66,
        padding:0,
        marginRight:10
    },box3:{
        flexDirection:'row',
  },box:{
        flexDirection:'row',
        padding:5,
        paddingTop:5,
        backgroundColor:'#fff',
        shadowColor: '#555',
        marginTop:10,
        borderRadius:5,
    shadowOffset: { width: 20, height: 5 },
    shadowOpacity: 0.8,
    shadowRadius: 2,  
    elevation: 5,
        paddingBottom:5,
    },outerBox:{
        width:'80%',
        marginLeft:'10%',
        marginRight:'10%',
        marginBottom:10,        
    },details:{
        height:70,
        width:'100%',
        padding:1
    }

})

В настоящее время высота остается постоянной, когда я получил ошибку.Кто-нибудь может помочь?

...