Open WangShayne opened 1 year ago
Modal
的placement
添加了middle
值,用以控制居中展示,请安装 @uiw/react-native@4.0.9 试一下效果 @WangShayne
import React, { useState, Fragment } from 'react';
import { View, Text, SafeAreaView } from 'react-native';
import { Modal, Button,Grid, Icon } from '@uiw/react-native';
function ButtonGroupView() {
const [visible,setVisible]= useState(false)
const data = Array.from(new Array(24)).map((_val, i) => {
return { icon: <Icon name="heart-on" color="red" />, text: `${i}`}
});
return (
<Fragment>
<Modal visible={visible} placement='middle'>
<SafeAreaView style={{width:600}}>
<View>
<Grid data={data} columns='6' hasLine={false}/>
<Button onPress={() => setVisible(false)}>
隐藏中间弹出的模态框
</Button>
</View>
</SafeAreaView>
</Modal>
<Button onPress={() => setVisible(true)}>
中间显示
</Button>
</Fragment>
);
}
export default ButtonGroupView
参考Ant Design Mobile RN