vue 报错 Avoid mutating a prop directly since the value will be overwritten whenever the parent compo

Vue报错：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: “selectedPage”；

这里发生的问题是：

子组件修改父组件的值导致报错，这里应该避免直接修改父组件的值。应该在data里面重新命名selectedPage这个字段。就可以解决问题。

import {mapState} from 'vuex'
export default {
  name: 'DynamicTabs',
  props: ['selectedPage'],
  computed: {
    ...mapState({
      tabs: state => state.aliveTabs.aliveTabs
    })
  },
  methods: {
    async initData () {
      // const datas = await getAddress()
      console.log(this.tabs)
    },
    handleRadioChange (key, keyPath) {
      console.log(key, keyPath)
      this.$emit('handleTabsChecked', key, keyPath)
      this.$router.push(key)
    },
    handleSelectedAside (key, keyPath) {
      console.log(key, keyPath)
    }
  },
  data () {
    return {
    //这里重新命名这个selectedPage字段，解除报错。
    //删除这句，就会报错
      selectedTabsPage: this.selectedPage
    }
  },
  created () {
    this.initData()
  }
}