定制prop和event
用作双向数据绑定
默认情况下, 一个组件上的v-model会:
	将 value用作 prop
	将 input用作 event
			
语法：	
	model: {prop?: string, event?: string} 

<!--
 * @FilePath: \hello-typescript\src\components\Child.vue
-->
<template>
    <div style="border: 1px solid black;padding: 2rem;">
        <h1>Child Component</h1>
        <input type="text" :value="value" @input="changed" placeholder="please write something..."/>
    </div>
</template>
<script lang="ts">
// InjectReactive
import { Component, Model, Vue, Emit, Inject, Prop } from 'vue-property-decorator'

@Component
export default class Chlid extends Vue {
    // data 数据范畴
    // model 数据绑定 也属于data 数据范畴，属于本地成员变量数据
    // 获取父组件关于input输入框中 value变量的绑定值 model 绑定为动态双向绑定
    @Model('input') value!: boolean

    // 转发input事件，动作名称叫input,parent中绑定名称也应交做input
    @Emit('input')
    // eslint对any类型警告，可以在package.json中关闭 也可以对指定地方关闭
    // eslint-disable-next-line @typescript-eslint/no-explicit-any
    changed (event: any) {
      return event.target.value
    }
}
</script>

<!--
 * @FilePath: \hello-typescript\src\views\Parent.vue
-->
<template>
    <div>
      <h1>Parent</h1>
      <Child v-model="content" @input="childChange"></Child><br/>
      <p>
        <b>
          Child 与 Parent 绑定的内容 => {{content}}
        </b>
      </p>
    </div>
</template>
<script lang="ts">
// ProvideReactive
import { Component, Vue, Provide } from 'vue-property-decorator'
import Child from '@/components/Child.vue'
@Component({
  components: {
    Child
  }
})
export default class Parent extends Vue {
  // data 范畴的数据
  // 一个组件只会有一个 v-model
  content = '初始化内容'

  // methods
  // eslint-disable-next-line @typescript-eslint/no-explicit-any
  private childChange (val: any, event: any) {
    window.console.log('val', val)
    window.console.log('event', event)
  }
}
</script>