I am using PrimeVue InputNumber, and when you click on the input, you have to delete the ‘0.00’ inside the input box before you can enter a number

I am trying to make it that when you @focus on the box, if the value is 0.00 then it makes it blank so that you can start entering a number

I have the input box:

<InputNumber v-model="item.price"
                         :name="'price[' + index + ']'"
                         mode="currency"
                         currency="GBP" locale="en-GB"
                         fluid
                         placeholder="Price..."
                         @focus="clearIfZero(item, $event)"
            />

and then the method:

const clearIfZero = (item, e) => {
if(item.price == 0){
    item.price = ''

    e.target.value = ''
}

}

No matter what, the value just stays as 0.00 and I have to manually delete it before I can start typing a new number