0

一旦我在TouchableOpacity 的事件处理程序中添加了rowData参数，我就有了这个 ListView UI，它开始运行缓慢。onPress按下 TouchableOpacity 后，它会保持按下状态 15 秒，然后再次平稳运行。

似乎有一些冲突，因为我在上面三行的 ListViewrowData的事件处理程序中也使用了。renderRow

我是对的，如何解决这个问题？

<ListView
    dataSource={this.state.dataSource}
    keyboardShouldPersistTaps={true}
    renderRow={(rowData) =>
        <TouchableOpacity
            onPress={(rowData) => {
                console.log(rowData);//ON THIS LINE IT HANGS 15s
            }}
        >
            <Text>{rowData}</Text>
        </TouchableOpacity>
    }
    automaticallyAdjustContentInsets={false}
/>
4

2 回答 2

4

我真的很想解释是什么让这个在javascript中如此昂贵的操作，但问题是你rowData作为参数传递给你的onPress函数，当rowData已经在上层范围（renderRow）中声明时。所以是的，就像你说的，发生了碰撞。

实际上， 的值由rowData重新定义onPress，因为onPress函数接收触摸事件作为参数。（您会注意到记录的数据实际上不是您的原始行数据，而是一个触摸事件对象）。

您可以通过简单地重命名onPress函数的第一个参数来解决此问题。例如

 <TouchableOpacity
       onPress={(evt) => {
         console.log(rowData); //now it doesn't hang
       }}
 >
于 2016-09-25T23:25:06.627 回答
1

我们可以用 Webview 放置标题吗？喜欢

render() { // eslint-disable-line class-methods-use-this return (

  <Container theme={theme} style={{ backgroundColor: theme.defaultBackgroundColor }}>
    <Header style={{ justifyContent: 'flex-start', paddingTop: (Platform.OS === 'ios') ? 23 : 9 }}>
      <Button transparent onPress={() => this.popRoute()} >
       <Icon name="ios-arrow-round-back-outline" style={{ fontSize: 30, lineHeight: 32, paddingRight: 10 }} />
        Find Stores
      </Button>
   </Header>

  <WebView
      ref={WEBVIEW_REF}
      automaticallyAdjustContentInsets={false}
      source={{uri: this.state.url}}
      javaScriptEnabled={true}
      domStorageEnabled={true}
      decelerationRate="normal"
      onNavigationStateChange={this.onNavigationStateChange}
      onShouldStartLoadWithRequest={this.onShouldStartLoadWithRequest}
      startInLoadingState={true}
      scalesPageToFit={this.state.scalesPageToFit}
    />

  </Container>
);
于 2016-12-20T08:00:49.083 回答