vue3.0学习笔记（computed）

vue3.0 计算属性需要单独引入（兼容2.0版本写法）

<template>
   姓：<input type="text" v-model="person.firstName">
    <br/>
   名：<input type="text" v-model="person.lastName">
    <br/>
  <span>{{person.fullName}}</span>
    <br/>
   全名:<input type="text" v-model="person.fullName">
</template>
import { reactive,computed } from 'vue'

export  default  {
  setup() {
    let person = reactive({
      firstName:"",
      lastName:''
    })
    person.fullName = computed({
      get(){
        return person.firstName + '-' + person.lastName
      },
      set(value){
        let name = value.split('-')
        person.firstName = name[0]
        person.lastName = name[1]
      }
    })
    return {
      person
    }
 }
}