vue router 傳props 參數(shù)的問(wèn)題

如圖我想傳一個(gè)數(shù)據(jù)對(duì)象給urlsection組件，而內(nèi)容需要請(qǐng)求route.query
所以用fetch請(qǐng)求了一下，得到結(jié)果return回去，得到props：{defineData：{}}的格式
但是子組件沒(méi)有接到名為defineData的prop，所以想問(wèn)下應(yīng)該怎么寫(xiě)比較好
文檔是這么寫(xiě)的，糾結(jié)好長(zhǎng)時(shí)間了求指教
https://router.vuejs.org/zh-c...

{
    path: 'page',
    component: urlSection,
    props: (route) =>{
        let obj = {
            defineData:{}
        }
        fetch(route.query, (err, data) => {
            if(data){obj.defineData=data}
        })
        return obj
    },
    beforeEnter: (to, from, next) => {
        // ...
    }
},

我看見(jiàn)一個(gè)beforeEnter函數(shù)可以寫(xiě)在route里，能不能通過(guò)這個(gè)把props的內(nèi)容修改呢？具體怎么操作?

回答

編輯回答

你好胸

你這是異步return不出去
為什么不在組件內(nèi)部created內(nèi)發(fā)請(qǐng)求
數(shù)據(jù)獲取

2018年3月18日 03:53

編輯回答

維他命

import Vue from 'vue'
import VueRouter from 'vue-router'
import Hello from './Hello.vue'

Vue.use(VueRouter)

function dynamicPropsFn (route) {
  const now = new Date()
  return {
    name: (now.getFullYear() + parseInt(route.params.years)) + '!'
  }
}

const router = new VueRouter({
  mode: 'history',
  base: __dirname,
  routes: [
    { path: '/', component: Hello }, // No props, no nothing
    { path: '/hello/:name', component: Hello, props: true }, // Pass route.params to props
    { path: '/static', component: Hello, props: { name: 'world' }}, // static values
    { path: '/dynamic/:years', component: Hello, props: dynamicPropsFn }, // custom logic for mapping between route and props
    { path: '/attrs', component: Hello, props: { name: 'attrs' }}
  ]
})

我說(shuō)的情況對(duì)應(yīng)倒數(shù)第二種了

2018年9月6日 18:30