About Computed property “username” was assigned to but it has no setter. Error solution

Look at the code first:

<template>
<div>
  <h4>计算属性完整写法</h4>
  <input type="text" v-model="username">
</div>
</template>

<script>

export default {
  computed:{
    username(){
      return '刘德华'
    }
  }
}
</script>

<style>

</style>

 What is the reason:

First of all, the premise of this error is that you have obtained the name in the computed attribute, but if you directly modify the value of name elsewhere on the page, this error will be reported

 Solution :

<template>
<div>
  <h4>计算属性完整写法</h4>
  <input type="text" v-model="username">
</div>
</template>

<script>

export default {
  /***
   * 语法：
   * computed:{
      '计算属性名':{
          set(值){
        },
           get(){
            return 值
        }
      }
  }
   */
  computed:{
    username:{
      //给usename赋值触发set方法
      set(val){
        console.log(val);
      },
      //使用username的值触发get方法
      get(){
        return  '刘德华'
      }
    }
  }
}
</script>

<style>

</style>

When to use computed property full notation?

       When assigning values ​​to computed property variables

What do the set function and get function do?

       set receives the value to be assigned

       Get returns the specific value of this computed property