VueJs-使用vue-router将数据传递到subRoutes组件

博比

我不明白如何将“路由组件”加载的数据传递给“子路由组件”。(我正在将Vue.js与Vue-router结合使用)

我的路由器看起来像这样:

router.map({
  '/a': {
    component: A,
    subRoutes: {
      '/b': {
        component: B
      },
      '/c': {
        component: C
      }
    }
  }
});

我只想与组件B和C共享组件A加载的数据。

提前致谢 !

耶尔科·帕尔玛(Yerko Palma)

您有两个简单的选择。

丑陋的

使用子$parent路由组件中选项。这使您可以访问父实例,这不是推荐的方法,但是很有效

// from the child component
this.$parent.someData

好的

使用道具道具使您有机会将任何数据从父母传递给孩子。这样做更好,因为可以防止发生错误(传递数据而不是实例),并且仅传递所需的内容,即使它不是父数据的一部分也是如此。

// parent component
<template>
    <child :childsdata="parentdata"></child>
</template
<script>
    export default {
        data: function () {
            return {
                parentdata: 'Hello!'
            }
        }
    }
</script>

// child component
<template>
    {{ childsdata }} <!-- prints "Hello!" -->
</template>
<script>
    export default {
        props: {
            childsdata: {
                type: String
            }
        }
    }
</script>

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

使用Javascript(VueJs)将输入文件数据传递到PHP(Laravel)

来自分类Dev

vue js将数据传递到组件

来自分类Dev

将数据传递到组件Vue.js

来自分类Dev

将数据传递到根Vue类组件

来自分类Dev

Vue将数据传递到子组件

来自分类Dev

使用React钩子将数据传递到同级组件?

来自分类Dev

使用kefirjs将数据传递到React组件

来自分类Dev

将数据传递到VueJS中的另一个组件

来自分类Dev

Laravel和VueJS->如何将Controller数据传递到我的Vue视图中?

来自分类Dev

将数据传递到Vue模板

来自分类Dev

将数据传递到Vue模板

来自分类Dev

如何使用Nebular对话框组件将数据传递到Angular组件?

来自分类Dev

Vuejs将动态数据从父组件传递到子组件

来自分类Dev

将数据从子组件传递到子组件 Vuejs 2

来自分类Dev

Laravel刀片模板将数据传递到Vue JS组件

来自分类Dev

在vue.js 2.0中将数据传递到组件的textarea

来自分类Dev

Vuejs + Vue-Router,在HTTP帖子等视图之间传递数据

来自分类Dev

VueJS vue-router 将值传递给路由

来自分类Dev

使用钩子将数据传递到子组件时遇到麻烦

来自分类Dev

使用 Angular2 将数据传递到路由组件中

来自分类Dev

AngularJS:在angular-ui-router中使用$ state.go将数据传递到状态

来自分类Dev

AngularJS:在angular-ui-router中使用$ state.go将数据传递到状态

来自分类Dev

在 vue typescript 项目中使用 vuejs 组件

来自分类Dev

将 VueJS V-if 指令与 Vue Draggable 结合使用

来自分类Dev

如何从Vue.js的父组件将数据传递到类星体轻敲编辑器中?

来自分类Dev

通过VueJS中的道具将动态数据传递到引导程序的模态

来自分类Dev

使用PHP将数据传递到数据库

来自分类Dev

React:如何使用axios将api数据传递到子组件时解决未定义问题?

来自分类Dev

使用DownloadManager从Activity将数据传递到BroadcastReceiver

Related 相关文章

  1. 1

    使用Javascript(VueJs)将输入文件数据传递到PHP(Laravel)

  2. 2

    vue js将数据传递到组件

  3. 3

    将数据传递到组件Vue.js

  4. 4

    将数据传递到根Vue类组件

  5. 5

    Vue将数据传递到子组件

  6. 6

    使用React钩子将数据传递到同级组件?

  7. 7

    使用kefirjs将数据传递到React组件

  8. 8

    将数据传递到VueJS中的另一个组件

  9. 9

    Laravel和VueJS->如何将Controller数据传递到我的Vue视图中?

  10. 10

    将数据传递到Vue模板

  11. 11

    将数据传递到Vue模板

  12. 12

    如何使用Nebular对话框组件将数据传递到Angular组件?

  13. 13

    Vuejs将动态数据从父组件传递到子组件

  14. 14

    将数据从子组件传递到子组件 Vuejs 2

  15. 15

    Laravel刀片模板将数据传递到Vue JS组件

  16. 16

    在vue.js 2.0中将数据传递到组件的textarea

  17. 17

    Vuejs + Vue-Router,在HTTP帖子等视图之间传递数据

  18. 18

    VueJS vue-router 将值传递给路由

  19. 19

    使用钩子将数据传递到子组件时遇到麻烦

  20. 20

    使用 Angular2 将数据传递到路由组件中

  21. 21

    AngularJS:在angular-ui-router中使用$ state.go将数据传递到状态

  22. 22

    AngularJS:在angular-ui-router中使用$ state.go将数据传递到状态

  23. 23

    在 vue typescript 项目中使用 vuejs 组件

  24. 24

    将 VueJS V-if 指令与 Vue Draggable 结合使用

  25. 25

    如何从Vue.js的父组件将数据传递到类星体轻敲编辑器中?

  26. 26

    通过VueJS中的道具将动态数据传递到引导程序的模态

  27. 27

    使用PHP将数据传递到数据库

  28. 28

    React:如何使用axios将api数据传递到子组件时解决未定义问题?

  29. 29

    使用DownloadManager从Activity将数据传递到BroadcastReceiver

热门标签

归档