Ionic 从其他文件加载单击时的IonPopover

d4so4syb  于 2022-12-09  发布在  Ionic
关注(0)|答案(1)|浏览(149)

我正在尝试加载组件“IonPopover”通过按钮点击从外部文件“showPopUp.tsx”.
这是我尝试通过onClick()加载外部组件“IonPopover”的代码行。到目前为止,外部“ShowPopup()”函数被成功调用,并且if条件也被传递,但是组件“IonPopover”的返回不起作用。希望有人能帮助我。
文件:列表用户任务.tsx

import ShowPopup from "./showPopup";

                                        <IonButton
                                            fill="outline"
                                            slot="end" 
                                            onClick={() => ShowPopup(true)}
                                        >
                                            Details
                                        </IonButton>

文件:showPopUp.tsx

import { IonButton, IonPopover } from "@ionic/react";
import React from "react";

function ShowPopup(props: any): JSX.Element {
    if (props) {
        console.log("INSIDE");
        return (
            <div className="showpopup">
                <IonPopover className="popup">
                    showPopup
                    <IonButton className="close-btn">Schliessen</IonButton>
                    {props.children}
                </IonPopover>
            </div>
        );
    } else {
        throw new Error("TRIGGER FALSE");
    }
}
export default ShowPopup;
2vuwiymt

2vuwiymt1#

我不确定是否需要React,但在Angular中,我们使用

router.navigate(["your page route for popup"],state: {variableName: value});

这个variableName可以被赋值为true/false,然后在其他文件中,你可以给予一个条件,当variableName为true时弹出窗口打开。

相关问题