Necesito ayuda con una pregunta, estoy tratando de habilitar un botón de guardar deshabilitado cuando alguien cambia el formulario durante dos días, hoy me di cuenta de que la compra que estoy haciendo lodash no funciona, cada vez que cambio algo en el formulario. tanto la variable oldForm como el formulario, tambien estan cambiadas, he hecho de todo y aun asi no podia habilitar el boton.

Código de componente de botón en vuejs

 <template> <div v-bind:class="isActive()" class="flex w-max rounded text-xs"> <inertia-link class="py-2 px-6 uppercase" v-if="href" :href="href"> <slot></slot> </inertia-link> <button v-if="!href" disabled="!changed" class="py-2 px-6 uppercase" type="button"> <slot></slot> </button> </div> </template> <script> import _ from 'lodash' export default { props: { href: String, active: { type: Boolean, default: true }, form:{ type: Object }, processing: { type: Boolean, default: false } }, data(){ return{ changed: false, } }, computed:{ oldForm(){ return this.form; } }, watch:{ oldForm(){ this.oldForm = _.cloneDeep(this.form) }, form:{ handler(){ this.changed = !_.isEqual(this.form, this.oldForm) console.log(this.form) console.log(this.oldForm) }, deep: true, }, }, } </script>

Llamando al botón en el formulario:

 <submit-button :processing="form.processing" :form="form" :active="isFormChanged" @click.native="save()"> <i class="fas fa-save"></i> Salvar </submit-button>

Con console.log , descubrí que eran iguales, ¿cómo almaceno uno y lo comparo con el otro para habilitar el botón?

Solo puedo usar VueJS y lodash para resolver esto.