我这里有这个 Barchart 渲染组件
const BarCharts = () => {
const fill = 'rgb(134, 65, 244)'
const data = [50, 10, 40, 95, -4, -24, null, 85, undefined, 0, 35, 53, -53, 24, 50, -20, -80]
return (
<View style={styles.sectionContainer}>
<BarChart style={{ height: 200 }} data={data} svg={{ fill }} contentInset={{ top: 30, bottom: 30 }}>
<Grid />
</BarChart>
</View>
);
};
我必须使用这个组件来绘制另一个组件内的条形图。我想在以下组件的 if 中使用 Barcharts 组件:
<SearchableDropdown
onItemSelect={(item) => {
if (item.type =='1') {
//alert(item.type);
return <BarCharts />
}
if (item.type =='2') {
alert(item.type);
}
}}
目前,条件 if 中的“返回”没有返回任何内容。单击 item1 时,将返回 BarCharts
你可以尝试类似的东西
function Example() {
const [showChart, setShowChart] = useState(false); // Default bar chart won't be display
return (
<View>
<SearchableDropdown
onItemSelect={(item) => {
if (item.type =='1') {
setShowChart(true); // Chart will be display here when state changes
}
if (item.type =='2') {
alert(item.type);
}
}}
/>
{showChart && <BarCharts /> }
</View>
);
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句