I'm using the Vue Currency Input to an input on the app that I'm working on, I'm not sure why I have this weird issue when the old prop comes back even thought no change was fired. The behaviour is: I edit the price and save, but when I click to be editable again the old price pops up.

This is my code:

<template>
    <div>
        <input ref="input" :value="val" v-currency="options" allow-negative="false" class="editableValue" @change="change" @keydown.enter.prevent>
    </div>
</template>

<script>
import { parse } from "vue-currency-input";
import { UTILS } from "@/helpers/utils.js";

export default {
    name: "EditableValue",
    data(){
        return {
            val: this.value
        }
    },
    props: {
        currency: {
            type: Object
        },
        value: {
            type: Number
        }
    }, 
    computed: {
        options() {
            return {
                autoDecimalMode: true,
                currency: {prefix: this.currency.currency + " "},
                distractionFree: false
            };
        },
    },
    methods: {
        change(){
            console.log('chamou')
            let newValue = parse(this.$refs.input.value, this.options);
            this.val = newValue;
            this.$emit('finishEditPrice', newValue)
        },
    },
    watch: {
        value(current) {
            let inputValue = this.$refs.input.value;
            let formattedValue = UTILS.getFormattedPrice(current, this.currency);
            if (inputValue != formattedValue) {
                this.val = formattedValue;
                this.$refs.input.value = formattedValue;
            }
        },
    },
    updated(){
        // if (inputValue != formattedValue) {
        //     this.val = formattedValue;
        //     this.$refs.input.value = formattedValue;
        // }
    }
};
</script>

The updated() and watch was a trial to change this behaviour but no luck. I'm using this version "vue-currency-input": "^1.22.6". Does anyone have any idea how to solve it? Thanks!