Skip to content

vue3 router not work for mobile #7

Open
@SvenWangChina

Description

@SvenWangChina

Meteor.js: v2.5.1
Vue.js: v3.2.23
Vue router: v4.0.12

Work fine on chrome, but get follow error on mobile. If had some comments or some component with slot, i will get the error when change route, e.g. router.push({ name: 'Demo' })

repo: https://github.com/SvenWangChina/meteor-vue3-vue-router-demo

Home.vue

<template>
    <div class="page-container">
        <app-spacer>test slot</app-spacer>
        <div @click="onGoDemo">Go Demo</div>
    </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';
import { useRouter } from 'vue-router';

import AppSpacer from '../../components/AppSpacer/index.vue';

export default defineComponent({
    name: 'Home',
    components: { 'app-spacer': AppSpacer },
    setup(_props, _ctx) {
        const router = useRouter();
        const showTips = ref(true);
        function onGoDemo() {
            router.push({ name: 'Demo' });
        }

        return {
            showTips,
            onGoDemo,
        };
    },
});
</script>

<style scoped>
.page-container {
    color: #000;
}
</style>

[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue at https://new-issue.vuejs.org/?repo=vuejs/vue-next 
  at <RouterView> 
  at <Root>
modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34614 Uncaught (in promise) TypeError: Cannot read property 'type' of null
    at unmountComponent (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34614)
    at unmount (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34530)
    at unmountChildren (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34658)
    at unmount (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34548)
    at unmountComponent (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34629)
    at unmount (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34530)
    at patch (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:33508)
    at ReactiveEffect.componentUpdateFn [as fn] (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:34143)
    at ReactiveEffect.run (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:38962)
    at callWithErrorHandling (modules.js?hash=51e33e4b97563d701eb5551f189030f2ce898b27:36512)

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions