React Native - Touchable and Victory Chart

我如何防止新闻事件被胜利图截取，而不是点击通过可触摸的父项？本质上，我希望能够点击图表上的任何位置并转到详细视图。最终，touchableOpacity元素中还会有其他元素，所以我不想直接在图表上捕获新闻。React Native - Touchable and Victory Chart

我对可怜的措辞表示歉意，我对React和React Native非常陌生。

<TouchableOpacity 
    style={styles.panel} 
    onPress={this.handleSubmit.bind(this)}> 
    <VictoryChart> 
     <VictoryBar 
     style={{ 
      data: {fill: "blue"} 
     }} 
     data={data} 
     x="quarter" 
     y="earnings" 
     /> 
    </VictoryChart> 
    </TouchableOpacity>

来源

2017-10-22 linzlu

您是否试过events道具？ Read about it here

该文档显示这个例子...

events={[{ 
    childName: "all", 
    target: "data", 
    eventHandlers: { 
     onClick:() => { 
     return [ 
      { 
      childName: "area-2", 
      target: "data", 
      mutation: (props) => ({ style: Object.assign({}, props.style, { fill: "gold" }) }) 
      }, { 
      childName: "area-3", 
      target: "data", 
      mutation: (props) => ({ style: Object.assign({}, props.style, { fill: "orange" }) }) 
      }, { 
      childName: "area-4", 
      target: "data", 
      mutation: (props) => ({ style: Object.assign({}, props.style, { fill: "red" }) }) 
      } 
     ]; 
     } 
    } 
    }] 
}

这显示了onClick处理器，用来变异的实际数据，但我不明白为什么你不能用它来任何理由导航到详细信息屏幕。我不确定你需要的语法。

来源

2017-10-22 03:23:57

这似乎不是我所期待的。事件支持让我可以拦截图表上的一个接触点，但是我最终计划除了我的触摸点之外还有更多的元素，所以我正在寻找那个级别的事件。 – linzlu

想到另一种方法。尝试在VictoryChart之后添加第二个不可见视图。我将它称为InvisibleView。将VictoryChart和InvisibleView都放在父视图中，使InvisibleView可以像这样触摸...

const InvisibleView =() => <View style={StyleSheet.absoluteFill} />/ 

<View> 
    <VictoryChart ...> 
    <TouchableOpacity...> 
     <InvisibleView /> 
    </TouchableOpacity> 
</View>

来源

2017-10-26 14:50:23

React Native - Touchable and Victory Chart

回答

相关问题