Skip to content

useVModel ​

Category
Export Size
533 B
Last Changed
2 months ago
Related

Shorthand for v-model binding, props + emit -> ref

Usage ​

js
import { useVModel } from '@vueuse/core'

export default {
  setup(props, { emit }) {
    const data = useVModel(props, 'data', emit)

    console.log(data.value) // props.data
    data.value = 'foo' // emit('update:data', 'foo')
  },
}
import { useVModel } from '@vueuse/core'

export default {
  setup(props, { emit }) {
    const data = useVModel(props, 'data', emit)

    console.log(data.value) // props.data
    data.value = 'foo' // emit('update:data', 'foo')
  },
}

<script setup> ​

vue
<script lang="ts" setup>
import { useVModel } from '@vueuse/core'

const props = defineProps<{
  modelValue: string
}>()
const emit = defineEmits(['update:modelValue'])

const data = useVModel(props, 'modelValue', emit)
</script>
<script lang="ts" setup>
import { useVModel } from '@vueuse/core'

const props = defineProps<{
  modelValue: string
}>()
const emit = defineEmits(['update:modelValue'])

const data = useVModel(props, 'modelValue', emit)
</script>

Source ​

Source • Docs

Contributors ​

Anthony Fu
Jelf
webfansplz
motian
objectisundefined
Alex Liu
白雾三语
Eduardo Wesley
Roman Meshcheryakov
久染
chaii3
Tmk
wheat
sondh0127
Zenthae
Eduardo San Martin Morote
lstoeferle
Alex Kozack
Homyee King
Prabu Rangki
Leonidas Arvanitis
yangger

Changelog ​

v10.4.0 on 8/25/2023
48f4c - fix: clone set to true triggered infinite loop (#3097)
v10.2.0 on 6/16/2023
7d788 - feat: improve types overload (#3055)
v10.0.0-beta.5 on 4/13/2023
cb644 - refactor!: remove isFunction and isString utils
v10.0.0-beta.1 on 3/23/2023
f8a53 - feat: add shouldEmit hook (#2836)
v9.2.0 on 9/5/2022
369e1 - feat: support clone option (#2022)
v8.9.3 on 7/14/2022
10f5a - fix: fix compact with 2.7, fix #1745 (#1898)
71550 - fix!: rename type VModelOptions to UseVModelOptions (#1894)
v8.9.2 on 7/12/2022
53319 - feat: compact with 2.7, fix #1745 (#1798)
v8.5.0 on 5/16/2022
70d80 - fix: unified value (#1568)
v8.4.2 on 5/5/2022
50d8a - fix: return default value when it's nil only (#1567)
f4e88 - fix: defaultValue can work with null (#1565)
v8.4.1 on 5/4/2022
0f3dd - fix: returning undefined on false values (#1557)
v8.4.0 on 5/3/2022
66e82 - feat: add option to define defaultValue (#1537)

Released under the MIT License.