首页 > 解决方案 > 如何在 vuetify 中单击按钮导航到另一个页面?

问题描述

单击 vuetify 中的按钮后,我试图导航到另一个页面,但无法做到这一点。单击下一页按钮后,它应该导航到新页面。

这是按钮所在的网址:

http://localhost:8080/viewer/?id_product=548

这是我的代码:

ProductDetailsCard.vue

<v-btn @click="this.$router.push({path: '/newpage'})">Next Page</v-btn>

路由器 > index.js

import Vue from 'vue';
import Router from 'vue-router';
import NewPage from '../components/NewPage.vue';

Vue.use(Router)

export default new Router({
    mode: 'history',
    base: process.eventNames.BASE_URL,
    routes: [
        {
            path: '/newpage',
            name: 'newpage',
            component: NewPage
        }
    ]
})

谁能帮我?

标签: javascripttypescriptvue.jsprestashopvuetify.js

解决方案


Vuetify 按钮支持to属性

<v-btn to="/newpage">Next Page</v-btn>

但是您的问题出在不同的地方,使用不带引号的组件作为对组件类的引用,而不是字符串值。

component: NewPage

推荐阅读