Vue2 js將某個路線輸入的某些值傳遞給另一個路線或將數據屬性從一個路線分享到另一個路線

Question

在vue2 js中執行酒店房間預訂申請。有兩個屏幕1）一個獲得搜索輸入值2）顯示搜索結果頁面。見下文

我route.js的截屏如下

import FrontEndHome from './components/fontend/Home.vue'; 
import FrontEndCheck from './components/fontend/Check.vue'; 

export const routes = [ 
    { path: '/', component: FrontEndHome }, 
    { path: '/check', component: FrontEndCheck } 
]; 

我要的是具有和日期從第一圖像獲取和擁有在第二張圖片中顯示這些日期。

Answer 1

你想通過路由傳遞數據。你可以看到如何實現這一VUE的文檔中https://router.vuejs.org/en/essentials/passing-props.html

Answer 2

你可以做這樣的事情在app.vue如下：

<template> 
    <router-view :items="items"></router-view> 
</template> 
<script> 
export default { 
    name: 'app', 
    data() { 
    return { 
     items: 6 
    } 
    }, 
} 
</script> 

，並在Check.vue組件：

<template> 
    <div>{{items}}</div> 
</div> 
</template> 
<script> 
export default { 
    name: 'FrontEndCheck', 
    props: ['items'], 
} 
</script> 

在換句話說，您可以將組件道具的邏輯應用到router-view（因爲它是組件）。它適用於我的應用程序。