vue中的inject

最近看源碼有一段對於整合參數的代碼，

normalizeProps(child, vm)
  normalizeInject(child, vm)
  normalizeDirectives(child)

想象裏邊的Inject不多用到，因此查了一下資料，

一般組件傳參是有兩種狀況

1. 父子組件進行傳參，這時候一般利用props
2. 非父子組件傳參，這時候通常利用vuex

會有一種狀況隔代組件傳參,這時候能夠利用props一層一層傳遞下去，可是代碼就比較亂了
因此就有了provide/inject進行隔代組件傳遞
父組件

<template>
    <div class="test">
        <son></son>
    </div>
</template>
<script>
export default {
    name: 'Test',
    provide: {
        name: 'Garrett'
    }
}
</script>

子組件

<template>
    <div>
        {{name}}
    </div>
</template>
 
<script>
export default {
    name: 'Garrettson',
    inject: [name]
}
</script>

對於使用場景，基礎組件應該使用props，我我的以爲通常用於比較複雜業務，提供基礎數據，好比最近的基金詳情頁。能夠直接在最頂層提供基金的基本信息，而後子組件均可以訪問的到，不用每一個單獨提供detail的props 屬性