ページ再ロード時にparamsが動作しないvue-routerルート

Question

私のプロジェクトでvue-routerを使用しています。

私の名前付きルートに完全に細かくナビゲートすることができます。私の唯一の問題は、パラメータを期待する名前付きルートを使用するときです。ページを更新するとロードされません。私が使用していますか

'/example/:username': { 
    name: 'example-profile', 
    title: 'Example Profile', 
    component: ExampleComponent 
} 

これはvue-routerroute：

は、ここに私のルートである

<a v-link="{ name: 'example-profile', params: { username: raaaaf } }"> 
    Example Link 
</a> 

私はmydomain.com/example/raaaafを得るExample Linkを選択

。

最初の読み込み時に正しいテンプレートがレンダリングされますが、アドレスバーにリンクを更新または手動で入力すると、Page Not Foundページにリダイレクトされ、ページの作成時に呼び出されるメソッドはトリガーされません。

これは私が私のに持っているものです。

<template> 
<div class="small-12 left"> 
    <side-bar></side-bar> 
    <div class="store-right"> 
     <store-details></store-details> 
     <store-menu></store-menu> 
     <store-listings></store-listings> 
    </div> 
</div> 
</template> 

<script> 
    export default { 
     data() { 
      return { 
       username: null, 
       user: null, 
      } 
     }, 

     created() { 
      this.getUser() 
     }, 

     methods: { 
      getUser() { 
       console.log(this.$route.params); 
      } 
     } 
    } 
</script> 

Answer 1

あなたは正しくサーバーを設定する必要があります。あなたのサーバは本質的に/example/raaaafディレクトリのインデックスファイルを探しています。私はこのページを慎重に読んでいます：http://router.vuejs.org/en/essentials/history-mode.html

Answer 2

同じ問題に直面している人は誰もわかりませんが、リフレッシュ時にルートパラメータを取得する際に問題が発生しました。取得しようとしていたルートパラメータはID番号でした。このIDを使用してデータを取得し、ページにデータを取り込みます。私は（多くのコンソールログを通して）私がリフレッシュしたときに、数字が文字列に変わっていたことがわかりました。なぜページが動かなかったのですか？私はそれを整理しましたが、IDを番号にキャストしてから使用してください：

Number($route.params.id)