1

如何防止新闻事件被胜利图表拦截，而是“点击”到可触摸的父级？本质上，我希望能够单击图表上的任意位置并转到详细视图。最终在 touchableOpacity 元素中会有其他元素，所以我不想直接在图表上捕获新闻。

我为糟糕的措辞道歉，我对 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>
4

3 回答 3

1

这已经回答here。如链接中所述，将道具添加containerComponent到 VictoryChart 组件将onPress在单击时调用 TouchableOpacity 中的函数。

于 2020-07-02T18:53:58.877 回答
0

你试过events道具吗？在这里阅读

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

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-22T03:23:57.600 回答
0

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

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

<View>
    <VictoryChart ...>
    <TouchableOpacity...>
        <InvisibleView />
    </TouchableOpacity>
</View>
于 2017-10-26T14:50:23.513 回答