panthro's avatar

Computed on a model value?

In my component I define a model:

const model = defineModel({
    type: Number,
});

I want the model value to be based upon an inputs value, so I have an input:

const input = ref(null);

This is bound to a text input with v-model:

<input v-model="input" />

Then I set the model to be based upon the input (this is a basic example of manipulation that I need to do):

model.value = computed(() => Number(input.value));

But I am having issues with the model updating in the parent component in development (works in build).

{{ someNumber }} //does not update
<MyComponent v-model="someNumber" />

This is very strange as it works when I run a build but not in dev, can anyone shed any light on this?

0 likes
2 replies
dcmastenbroek's avatar

Why not directly use model on the input?

const model = defineModel({
    type: Number,
});

...

<input v-model="model" />
panthro's avatar

@dcmastenbroek As I stated in my question, I need to manipulate the model, yet i do not wish to display the manipulation.

Please or to participate in this conversation.