From bbe0002f86d3beb18cb30b4bb418e66a7596b848 Mon Sep 17 00:00:00 2001 From: Luis Saraza Date: Tue, 8 Nov 2022 13:05:07 -0500 Subject: [PATCH] docs: Update Setting Globally at Registration Docs to Vue3 (#1693) --- docs/guide/components.md | 21 +++++++++++++++++++++ 1 file changed, 21 insertions(+) diff --git a/docs/guide/components.md b/docs/guide/components.md index e5436f4..ceadd13 100644 --- a/docs/guide/components.md +++ b/docs/guide/components.md @@ -61,6 +61,7 @@ export default { If you want all instances of Vue Select to use your custom components throughout your app, while only having to set the implementation once, you can do so when registering Vue Select as a component. +## Vue 2x ```js import Vue from 'vue'; import vSelect from 'vue-select'; @@ -79,5 +80,25 @@ vSelect.props.components.default = () => ({ Vue.component(vSelect) ``` +## Vue 3x +```js +import {createApp, h} from 'vue'; +import vSelect from 'vue-select'; + +// Set the components prop default to return our fresh components +vSelect.props.components.default = () => ({ + Deselect: { + render: () => h('span', '❌'), + }, + OpenIndicator: { + render: () => h('span', '🔽'), + }, +}); + +// Register the component +const app = createApp(App); +app.component('vSelect', vSelect); +``` +