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（因为它是组件）。它适用于我的应用程序。