为了账号安全,请及时绑定邮箱和手机立即绑定

Popover组件,ios上点击遮罩层不能关闭气泡,安卓上测可以

Popover组件,ios上点击遮罩层不能关闭气泡,安卓上测可以

杨__羊羊 2019-03-15 16:15:37
antd里的Popover组件,ios上点击遮罩层不能关闭气泡,目前安卓上测试可以,为了兼容ios难道只有手写气泡组件吗...多麻烦啊const Item = Popover.Item;class More extends React.Component {    constructor(props) {        super(props);        this.state = {            visible: false,            selected: '',        };    };    onSelect = (opt) => {        this.setState({            visible: false,            selected: opt.props.value,        });        if (opt.props.value == '') {            ///        } else if (opt.props.value == '') {            ///        }    };    handleVisibleChange = (visible) => {        this.setState({            visible,        });    };    render() {        let offsetX = -((document.querySelector('body').offsetWidth) * 0.125) + 9;        return (            <div>                <Popover                     mask                    overlayClassName="fortest"                    overlayStyle={{ color: 'currentColor' }}                    visible={this.state.visible}                    className="c-more"                    overlay={[                        (<Item key="4" value="code" icon={<Icon type={require('./image/QrCode1.svg')} size="xs" />} data-seed="logId">                            二维码                        </Item>),                        (<Item key="6" value="quit" icon={<Icon type={require('./image/PullOut1.svg')} size="xs" />}>                             <span style={{ marginRight: 5 }}>退出</span>                        </Item>),                    ]}                    align={{                        overflow: { adjustY: 100, adjustX: 0 },                        offset: [offsetX, -180],                    }}                    onVisibleChange={this.handleVisibleChange}                    onSelect={this.onSelect}                >                    <div className="c-more-button"                        icon={<Icon type={require('./image/more1.svg')} size="md" />}                    >                    </div>                </Popover>            </div>        );    }}
查看完整描述

1 回答

  • 1 回答
  • 0 关注
  • 861 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号