Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The 'popupVisible' not work #307

Open
TaurusWood opened this issue Sep 8, 2022 · 4 comments
Open

The 'popupVisible' not work #307

TaurusWood opened this issue Sep 8, 2022 · 4 comments

Comments

@TaurusWood
Copy link

I use 'popupVisible' and 'onPopupVisibleChange' with React.useState,but popup won't close once opened

import React, { useState } from "react";
import "antd/dist/antd.css";

import Trigger from "rc-trigger";
import { List, Button } from "antd";

import "./index.css";

const App = () => {
  const [visible, setVisible] = useState(false)

  console.log(`visible`, visible)

  return (
    <div className="wrapper">
      <Trigger
        popupVisible={visible}
        action={["click"]}
        // destroyPopupOnHide={true}
        popup={<span>popup</span>}
        popupAlign={{
          points: ['tl', 'tr'],
          // offset: [0, 3]
        }}
        onPopupVisibleChange={(a) => {
          console.log('a', a)
          setVisible(a);
        }}
      >
        <Button block >+++</Button>
      </Trigger>
    </div>
  );
};

export default App;
Edit 垂直菜单 - antd@4.23.0 (forked)
@Cuiyansong
Copy link

Maybe the real reason is Do not call Hooks in class components. and rc-trigger is class component.
https://reactjs.org/warnings/invalid-hook-call-warning.html#breaking-the-rules-of-hooks

@molnarlaura
Copy link

+1 the click event is not propagated to the child components if the trigger action is set to click: CodeSandbox-Example

@shaunhurryup
Copy link

shaunhurryup commented Dec 19, 2022

I add prop destroyTooltipOnHide={true} on another lib named rc-tooltip, and it can close finally.

In this lib, the prop named destroyPopupOnHide

@SSSliangfeng
Copy link

SSSliangfeng commented Aug 7, 2023

+1 I come across same bug after upgrade react from 16 to 18 , the rc-trigger can't close popup after the popupVisible is false. @zombieJ

<Trigger action={!disabled ? ['click'] : []} prefixCls={prefix} popup={<Popup {...props} onCancel={handleCancel} onConfirm={handleConfirm} />} popupVisible={disabled ? false : popupVisible} onPopupVisibleChange={setPopupVisible} popupStyle={{ position: 'absolute', zIndex: 1050 }} builtinPlacements={BUILT_IN_PLACEMENTS} popupPlacement="bottomLeft" popupTransitionName={popupTransitionName} getPopupContainer={getPopupContainer || getContextPopupContainer} > <Selector forwardRef={selectorRef} onRemove={handleItemRemove} onClear={handleClear} {...props} /> </Trigger>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants