[Vuejs]-How to reference modelValue from a function in a VUE componenet

by

3👍

✅

Try to assign the define props to a prop constant the use that constant to access the prop field, and use computed property instead of the function :

<script setup>
import {computed} from 'vue';

const props = defineProps([ 'modelValue' ]);
const emit = defineEmits([ 'udpate:model-value' ]);

const portPlaceholder = computed(()=>{
    if ( props.modelValue?.type === 'example' ) return 'something';
    if ( props.modelValue?.type === 'other' ) return 'something-else';
    return 'default-something';
 })

</script>
<template>
    Some input: <input type="text" :placeholder="portPlaceholder" />
</template>
👤Boussadjra Brahim

Leave a comment