nativescript-vue navigationTo在vue组件外部

时间:2019-11-24 20:48:35

标签: javascript nativescript-vue

你好,我有一个昨天解决的问题,但是又出现了。

我尝试使用一个功能在我的vue页面之间进行路由。

routes.js

import Page from '../components/Page'

const routes = {
    Page
}

export const vue = routes

Navigator.js

import { topmost } from 'tns-core-modules/ui/frame'

function navigateTo (page) {
  topmost().currentPage.__vuePageRef__.$navigateTo(page)
}

export { navigateTo }

Vue页面:

import {navigateTo} from "../router/navigator";

  created: function() {
    navigateTo(routes.vue.Page);
  }

但是它抛出了错误

  

System.err:TypeError:无法读取未定义的属性'currentPage'

我记得昨天我通过将NavigationTo'function'更改为'default function'来解决了这个问题。

但是这一次引发了一个错误:

  

System.err:TypeError:Object(...)不是函数

在通过 routes.vue.Page

感谢您的帮助。

1 个答案:

答案 0 :(得分:1)

它不能完全解决您遇到的错误,但效果很好。

router.js

import login from "./views/Login";
import home from "./views/Home";

export default {
    login,
    home
}

main.js

import Vue from "nativescript-vue";
import router from "./router";

Vue.prototype.$goTo = function(to, props, params) {
    if (!router[to]) return;

    this.$navigateTo(router[to], {
        props,
        ...params // clearHistory, backstackVisible
    });
}

Component.vue

export default {
    methods: {
        goToLogin() {
            this.$goTo("login");
        },
        goToHome(prop) {
            this.$goTo("home", { prop }, { clearHistory: true });
        }
    }
}