Answer the question
In order to leave comments, you need to log in
Setting up Nativesript vue router?
Hello
, I'm trying to set up routing for nativescript vue, when the button is pressed, it does not go to another component
main.js
import Vue from 'nativescript-vue'
import VueRouter from 'vue-router'
import App from './components/App'
import News from './components/News'
Vue.use(VueRouter)
// Prints Vue logs when --env.production is *NOT* set while building
Vue.config.silent = (TNS_ENV === 'production')
const router = new VueRouter({
pageRouting: true,
routes: [
//{path: '/app', component: App},
{path: '/news', component: News},
//{path: '*', redirect: '/app'}
]
});
router.beforeEach((to, from, next) => {
console.log(to)
})
//router.replace('/app');
new Vue({
router,
render: h => h('frame', [h(App)])
}).$start()
app.vue
<template>
<Page class="page">
<ActionBar class="action-bar" title="Home"/>
<StackLayout>
<Button class="btn btn-primary" @tap="$router.push('/news')">Counter</Button>
<Button class="btn btn-primary" @tap="$router.push('/hello')">Hello World</Button>
<Button class="btn btn-primary" @tap="$router.push('/reddit')">Reddit</Button>
<Button class="btn btn-primary" @tap="$router.push('/plugins')">Plugins</Button>
<Button class="btn btn-primary" @tap="$router.push('/refresh')">Pull to Refresh</Button>
<Button class="btn btn-primary" @tap="$router.push('/login')">Login Screen</Button>
</StackLayout>
</Page>
</template>
<script >
export default {
data() {
return {
msg: 'Hell11o World!'
}
}
}
</script>
<style scoped>
ActionBar {
background-color: #53ba82;
color: #ffffff;
}
.message {
vertical-align: center;
text-align: center;
font-size: 20;
color: #333333;
}
</style>
news.vue
<template>
<Page>
<StackLayout>
<Label text="Search by city name" padding="20" />
</StackLayout>
</Page>
</template>
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question