2017-05-26 87 views
0

我正在使用VueJS 2.3.3和coffescript,我試圖將一個道具傳遞給路由器的組件,但我沒有成功。代碼不是我的,所以我在確定我做錯了什麼時遇到了一些麻煩。這裏是我的路由器:通過路由器傳遞道具不起作用

App = require './views/App' 

Shared = { 
    header: require('./views/shared/header'), 
    global_loader: require('./views/shared/global_loader.vue') 
} 

view = (view_name) -> 
    require("./views/#{view_name}") 

componentize = (view_name, options = {}) -> 
    options.include_header ?= true 

    component = options.component || {} 

    component.app ?= view(view_name) 
    component.header = Shared.header if options.include_header 

    component 

exports.routes = [ 
    { 
    path: '/', 
    component: App 
    children: [ 
     { 
     path: '/component', 
     components: componentize('path/to/component'), 
     props: { has_groups: true } 
     }, 
     ... 
    ] 
    } 
    ... 
} 

這裏是我的App.vue代碼:

<template lang="pug"> 
    #app-wrapper 
     transition(name="fade") 
     router-view(name="global_loader") 

     #header-wrapper 
     router-view(name="header") 

     #current-view-wrapper.container 
     transition(name="enter") 
      router-view(name="app") 
    </template> 

在我的部分,我收到了道具和往常一樣:

props: 
    has_groups: 
     default: false 

一切工作正常,但has_groups沒有從路由器收到正確的prop值。它不會改變爲真。

任何人都可以幫我找出我失蹤的東西嗎?

回答

1

我找到了解決方案。當我使用命名路線時,我必須配置道具,如:

props: 
    global_loader: false 
    header: false 
    app: (route) -> ({ has_groups: true })