Closed
Description
I have a sample where I'm using your plugin to navigate to two different components and show the path in the $navigator.path and it works perfectly:
app.js
import Vue from 'nativescript-vue';
import App from './components/App';
import Navigator from 'nativescript-vue-navigator'
import { routes } from './routes'
Vue.use(Navigator, { routes })
new Vue({
render: h => h(App),
}).$start();
routes/index.js
import C1 from '~/components/c1'
import C2 from '~/components/c2'
export const routes = {
'/route-1': {
component: C1,
},
'/route-2': {
component: C2,
}
}
compontents/App.vue
<template>
<GridLayout class="App" rows="*, auto">
<ContentView row="0">
<Navigator defaultRoute="/route-1" />
</ContentView>
<nav row="1" />
</GridLayout>
</template>
<script>
import nav from "./nav";
export default {
components: {
nav
},
data() {
return {};
}
};
</script>
components/c1.vue
<template>
<Page class="page">
<StackLayout>
<Label text="Component 1" />
</StackLayout>
</Page>
</template>
<script>
export default {};
</script>
components/c2.vue
<template>
<Page class="page">
<StackLayout>
<Label text="Component 2" />
</StackLayout>
</Page>
</template>
<script>
export default {};
</script>
If I use class Style Vue components with in the components:
components/c2.vue
<template>
<Page class="page">
<StackLayout>
<Label text="Component 2" />
</StackLayout>
</Page>
</template>
<script>
@Component
export default class C2 extends Vue { };
</script>
Then $navigator.path isn't correctly updated and keeps the initial value.