2017-12-06 11 views
2

私は非常に単純なページを持っていますが、ほんの数行のコードがあり、vue-componentを使わずにvue-routerを使いたいと思います。vue 2にコンポーネントなしでvue-routerを使用できますか?

www.example.com/my-search-query 

をし、私のメインヴュー()オブジェクトでそれを使用します。

は私がルート後string "my-search-query"を取得したいと思います。これは可能ですか?

ありがとうございました!

+0

vue-routerを使いたい場合は、 '' 'window.location.pathname'''を使用してください。 –

+0

@tom_hパスが" my-other-search-query "に変わったときにどのように通知されますか? "?申し訳ありませんが、私はちょうどvueを学び始めています。 – JinJi

答えて

0

メインヴュー()Appオブジェクトの変更:

あなたはこのようなwww.example.com/#/my-search-queryから"my-search-query"文字列を取得できます。正しい方向に私を指しているため@samayoする

const router = new VueRouter({ 
    routes: [ 
    { path: '/:question' } 
    ] 
}) 

const app = new Vue({ 
    el: '#app', 
    router, 
    watch: { 
    '$route.params.question': function(newVal, oldVal) { 
     alert(newVal === 'my-search-query'); 
    } 
} 
}); 

ありがとう!

1

tom_hによれば、パス名を取得する場合は、window.location.pathnameを使用できます。あなたはときに、このパス名の変更通知を受けたい場合は、最初にあなたのデータ(){}オブジェクトに初期化して、それを見て:vue-componentなしvue-routerを使用することが可能である、まだパスについて通知すること

data() { 
    return { 
    path: window.location.pathname 
    } 
}, 

watch: { 
    path (newpath, oldpath) { 
    alert('location path just changed from ' + newpath + ' to ' + oldpath) 
    } 
} 
+0

これは、 'path'が変更されたときに通知しますが、' window.location.pathname'が変更されたときは通知しません。 – Bert

+0

しかし、ウィンドウのパス名も変更されたときにパスが変更されます – samayo

+1

'location.pathname'が変更され、ウォッチャーが実際に起動する例を表示できますか? – Bert

関連する問題