Vue 라우터 - 매개 변수가 전달되지 않음

Vue 라우터 - 매개 변수가 전달되지 않음

Programmatic Navigation을 사용하여 매개 변수를 전달할 수 없는 것 같습니다. 경로는 변경되지만 빈 개체 매개 변수가 있습니다.

main.discloss.main.discloss.

import Vue from 'vue';
  import VueRouter from 'vue-router';

  import App from './App.vue';

  const Hello = { props: ['name'], 
  template: `<h1>Hello {{$route.params}}  </h1>`,

  };
  const World = { template: `<h1>World</h1>`};

  const routes = [
    { path: '/hello', component: Hello, props: true },
    { path: '/world', component: World }
  ];

  const router = new VueRouter({
    routes
  });

  Vue.use(VueRouter);

  new Vue({
    el: '#app',
    router,
    render: h => h(App)
  });

app.vue

<template>
  <div id="app">
   {{ msg }}
   <button @click="move">werwer</button>
       <router-view/>

  </div>
</template>

<script>
export default {
  name: 'app',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  mounted() {
  },
  methods : {
    move() {
    this.$router.push({ path: '/hello', params: { name: 'Paul' } })
    }
  }
}
</script>

이렇게 하려면 이름 있는 루트를 사용해야 합니다.

프로그램적으로 밀어넣기

this.$router.push({ name: 'hello', params: { name: 'Paul' }}) 

그리고 정의에서

 const routes = [
    { name: 'hello', path: '/hello/', component: Hello, props: true },
    { path: '/world', component: World }
  ];

언급URL : https://stackoverflow.com/questions/49997895/vue-router-params-not-being-passed