时间戳

首页 > 解决方案 > panResponder 无法在反应原生 android 中工作

android - panResponder 无法在反应原生 android 中工作

问题描述

我没有看到 panResponsder 在我的 android 手机上工作，也没有看到应用程序按预期运行。我正在使用 expo 并扫描它以在我的 android 设备上运行应用程序。这是代码，我也使用了一个调试器，但似乎没有任何工作。

export default  class Deck extends React.Component {
    constructor(props){
        super(props);
        //decalred as  local variable 
        this.PanResponder=PanResponder.create({
            onStartShouldSetPanResponder: () => true,
            onPanResponderMove:(event,gesture)=>{
                debugger;
                console.log(gesture);
            },
            onPanResponderRelease:()=>{}
        });
        this.state={PanResponder};
    }
    renderCards=()=>{
        return this.props.data.map(item => {
            return this.props.renderCards(item);
        });
    }
    render(){
        return(
         <View {...this.state.PanResponder.panHandlers}> 
             {this.renderCards()}
         </View>
        );
    }
}

标签： androidreact-native

解决方案

1）你从 react-native 设置 this.state={PanResponder} 这个 PanResponder

所以 this.state.PanResponder.panHandlers 什么都不是。

尝试

export default  class Deck extends React.Component {
constructor(props){
    super(props);
    //decalred as  local variable 
    this.panResponder=PanResponder.create({
        onStartShouldSetPanResponder: () => true,
        onPanResponderMove:(event,gesture)=>{
            debugger;
            console.log(gesture);
        },
        onPanResponderRelease:()=>{}
    });
}
render(){
    return(
        <View {...this.panResponder.panHandlers}>
        </View>
    );
}

}

或者

export default  class Deck extends React.Component {
constructor(props){
    super(props);
    //decalred as  local variable 
    const panResponder=PanResponder.create({
        onStartShouldSetPanResponder: () => true,
        onPanResponderMove:(event,gesture)=>{
            debugger;
            console.log(gesture);
        },
        onPanResponderRelease:()=>{}
    });
    this.state={panResponder};
}
render(){
    return(
        <View {...this.state.panResponder.panHandlers}>
        </View>
    );
}

}

推荐阅读