embed the vue2 page:Application error:a client-side exception has occurred (see the browser console for more information).

[feiyu2000x]

Control console:8069-3c33bdf50ac3eeb0.js:1
Error: Minified React error #31; visit https://reactjs.org/docs/error-decoder.html?invariant=31&args[]=object%20with%20keys%20%7Bquestion%7D for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

I embedded it in the vue page using an iframe.
code :

    <div>
        <!-- <div class="mengban" @click="hidenTipBtn"></div> -->
        <a-tooltip placement="left" title="AI客服" :get-popup-container="getPopupContainer">
            <div class="tip" :style="{ right: tipRight }">
                <a-button-group shape="round">
                    <a-button type="primary" shape="round" @click="showTipBox">
                        <span>AI客服</span>
                    </a-button>
                    <a-button v-if="tipRight=='20px'" shape="round" @click="hidenTipBtn">x</a-button>
                </a-button-group>
            </div>
        </a-tooltip>
        <iframe v-show="showTip" allow="fullscreen;microphone" title="嗒上车AI智能客服" id="dify-chatbot-bubble-window."
            src="https://udify.app/chatbot/4OEvinl1fL2Hdnhy"
            style="border: medium none; position: fixed; flex-direction: column; justify-content: space-between; box-shadow: rgba(150, 150, 150, 0.2) 0px 10px 30px 0px, rgba(150, 150, 150, 0.2) 0px 0px 0px 1px; bottom: 5rem; right: 1rem; width: 24rem; max-width: calc(-2rem + 100vw); height: 40rem; max-height: calc(-6rem + 100vh); border-radius: 0.75rem; display: block; z-index: 2147483647; overflow: hidden; left: unset; background-color: rgb(243, 244, 246);"></iframe>
    </div>
</template>

<script>
    export default {
        name: 'DAISupportAgent',
        components: {},
        data() {
            return {
                showTip: false,
                tipRight: '-110px',

            }
        },
        methods: {
            showTipBox() {

                if (this.tipRight == '20px') {
                    this.showTip = !this.showTip;
                }
                if (this.tipRight == '-110px') {
                    this.tipRight = '20px'
                }
            },
            hidenTipBtn() {
                this.showTip = false;
                this.tipRight = '-110px'
            },
            getPopupContainer(trigger) {
                return trigger.parentElement;
            },
        },
    }
</script>

<style scoped>
    .tip {
        position: fixed;
        bottom: 20px;
        width: 120px;
        height: 30px;
    }
    .mengban{
        width: 100%;
        height: 100%;
        opacity: 1.0;
        float: left;
    }
</style>```