我正在尝试在 React Native 中使用至少两组水平 VictoryBar 图表来渲染 VictoryStack 图表。
我的代码如下所示:
<VictoryStack
labels={['icon-name-1', "icon-name-2"]}
domainPadding={{ x: 12, y: 0 }}
width={200}
height={50}
padding={0}
colorScale={[theme.COLOR_WHITE, theme.COLOR_LIGHT_DARKER]}
labelComponent={<IconLabel />}
>
<VictoryBar
barWidth={20}
horizontal
data={[
{
x: 1,
y: 23
}
]}
/>
<VictoryBar
barWidth={20}
horizontal
data={[
{
x: 1,
y: 37
}
]}
/>
</VictoryStack>
我的问题:不知何故,只呈现了一个标签,但我希望呈现两个标签,一个用于每个堆栈组,因为我还在VictoryStack
prop中定义了两个标签文本labels
。当我使用自定义标签组件IconLabel
时,console.logging IconLabel 中的道具时,只会创建一个控制台日志条目,这很奇怪,这里传递给 IconLabel 的道具一方面包括"icon-name-1"
astext
属性,但x: 1, y: 37
在date
属性中。所以看起来 VictoryStack 不识别第一个 VictoryBar 孩子。
但另一方面,条形图显示正确:
旁注:我使用的是自定义标签组件IconLabel
,但也可以只使用VictoryLabel
,问题是一样的。
你们中的一个人可能有解释吗?可能我在这里遗漏了一些非常小的东西,但我尝试了很多东西并没有解决这个问题......