useRefShared
Short version, this uses
useSharedRef
in HIVE mode.
Parameters
typescript
import { useRefShared } from '@elonehoo/pistachio'
const refShared = useRefShared(defaultValue?, id?)
import { useRefShared } from '@elonehoo/pistachio'
const refShared = useRefShared(defaultValue?, id?)
Parameters | Type | Required | Default | Description |
---|---|---|---|---|
defaultValue | T | false | undefined | Default value |
id | string | false | undefined | BroadcastChannel name, if not provided it will get be default getCurrentInstance().$vnode.tag this will allow have 1 shared reference per component |
State
The useRefShared
function returns a reactive ref
variable:
typescript
import { useRefShared } from '@elonehoo/pistachio'
const myShared = useRefShared()
import { useRefShared } from '@elonehoo/pistachio'
const myShared = useRefShared()
Example
To test please open 2 or more tabs and edit the input box
vue
<script setup lang="ts">
import { useRefShared } from '@elonehoo/pistachio'
const myRefVar = useRefShared('Hello world')
</script>
<template>
<div>
<p>
To test please open 2 or more tabs and edit the input box
</p>
<input v-model="myRefVar">
</div>
</template>
<script setup lang="ts">
import { useRefShared } from '@elonehoo/pistachio'
const myRefVar = useRefShared('Hello world')
</script>
<template>
<div>
<p>
To test please open 2 or more tabs and edit the input box
</p>
<input v-model="myRefVar">
</div>
</template>