Instead, use a data or computed property based on the prop's value. Vue JS

Viewed 25403

Well, I'm trying to change a value of "variable" in Vue, but when I click on the button they throw a message in console:

[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "menuOpen"

I have no idea how to solve this problem...

My file.vue:

<template>
  <button v-on:click="changeValue()">ALTERAR</button>
</template>

<script>

export default {
  name: 'layout',
  props: [ 'menuOpen' ],
  methods: {
    changeValue: function () {
      this.menuOpen = !this.menuOpen
    }
  },
}

</script>

Any one can help me? Thanks

1 Answers
Related