可触摸视图响应本机响应速度不是很好

Touchable view react native isn't very responsive

本文关键字：很好 响应速度 本机 触摸 视图 响应      更新时间：2023-09-26

我正在构建一个 react native 应用程序，我发现 react native 中的 Touchable 视图没有响应。当我触摸按钮时，需要一些时间才能看到结果。

当我在谷歌上搜索解决方案时，我发现 https://facebook.github.io/react-native/docs/performance.html 解决方案包含在requestAnimationFrame中。当我喜欢链接所说的内容时，它向我显示错误" this.requestAnimationFrame 不是函数"

有什么例子可以在 react-native 中使用 requestAnimationFrame 吗？

以下是我到目前为止所做的一些代码：

createBookingPage(){
        latestSender = bookings[0].from_name + " " + bookings[0].from_phone 
                        + " " + bookings[0].from_address;
        this.props.navigator.push({id: 4, latestSender, savedEmail, savedPassword});
      },
createBookingPage(){
        this.requestAnimationFrame(() => {
          this._createBookingPage();
        });
      },
        
    render(){
      return (<View>
              <TouchableHighlight style={styles.createButton}
                underlayColor='#ff7043' onPress={this.createBookingPage}>
                <Text style={{fontSize: 25, color: 'white'}}>+</Text>
              </TouchableHighlight>
            </View>);}

在主导航器页面中，自定义场景配置，以便在如下所示的视图中导航：

var SCREEN_WIDTH = require('Dimensions').get('window').width;
var BaseConfig = Navigator.SceneConfigs.FadeAndroid;
var CustomSceneConfig = Object.assign({}, BaseConfig, {
 //A very tightly wound spring will make this transition fast
 springTension: 80,
 springFriction: 0,
  //Use our custom gesture defined above
  gestures:{
 }
});

class Photoos_net extends Component {
constructor(props, context){
 super(props, context);
 this._configureScene = this._configureScene.bind(this);
 }
 render() {
   return (
     <Navigator
      initialRoute= {{id: 'Home' , component: 'Home' , index:0}}
      renderScene = {this.renderScene.bind(this)}
      statusBarBackgroundColor={'royalblue'}
      configureScene={this._configureScene}
     />
 );
}
 _configureScene(route){
    return CustomSceneConfig;
  }

现在您的过渡将比以前快得多。

相关文章：