1
1
111 1112019-07-10 15:48:20
Vue.js
111 111, 2019-07-10 15:48:20

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

1 answer(s)
P
Pavel Kokovin, 2019-08-09
@Per_Ardua

After all, next in beforeEach doesn’t just come to you)

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question