Vue.js provide()用法及代碼示例

提供一個可以由後代組件注入的值。

類型

function provide<T>(key: InjectionKey<T> | string, value: T): void

細節

provide() 接受兩個參數：鍵，可以是字符串或符號，以及要注入的值。

使用 TypeScript 時，鍵可以是轉換為 InjectionKey 的符號 - Vue 提供的實用程序類型，擴展了 Symbol ，可用於在 provide() 和 inject() 之間同步值類型。

與生命周期鉤子注冊 API 類似，provide() 必須在組件的 setup() 階段同步調用。

示例

<script setup>
import { ref, provide } from 'vue'
import { fooSymbol } from './injectionSymbols'

// provide static value
provide('foo', 'bar')

// provide reactive value
const count = ref(0)
provide('count', count)

// provide with Symbol keys
provide(fooSymbol, count)
</script>

相關用法

注：本文由純淨天空篩選整理自vuejs.org大神的英文原創作品 provide()。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。