vue.js的一些事件绑定和表单数据双向绑定

知识点： 
   v-on:相当于： 例如：v-on：click==@click  ,menthods事件绑定
   v-on修饰符可以指定键盘事件
   v-model进行表单数据的双向绑定
  


<template>

    <p v-for="item in list">{{item.name}}  {{item.price}}</p>
    <button v-on:click="addItem">addItem</button>  <!--v-on：相当于@-->
    <button @click="addItem">addItem</button>

   

<input v-on:keydown.enter="onKeydown"/>    <!--指令的修改器-->
    <componeta @my-event="onComponentEvent"></componeta>

    <!--<input v-model="myValue" type="text"/>{{myValue}} -->   <!--v-model文本框的事件绑定，表单的事件绑定---->
    <!--<input v-model.lazy="myValue" type="text"/>{{myValue}}--> <!--v-model.lazy延迟显示-->
    <!-- <input v-model.number="myValue" type="text"/>{{typeof  myValue}}-->  <!--v-model.number将123（string）转化为123（number）-->
    <input v-model.trim="myValue" type="text"/> {{myValue}}  <!--v-model.trim截取字符串前后的空格-->

    <hr>
    <input v-model="myBox" type="checkbox" value="apple"/>  <!--v-model多选框的事件绑定-->
    <input v-model="myBox" type="checkbox" value="banna"/>
    <input v-model="myBox" type="checkbox" value="pineapple"/>
    {{myBox}}

    <input v-model="myBox1" type="radio" value="apple"/>  <!--v-model单选框的事件绑定-->
    <input v-model="myBox1" type="radio" value="banna"/>
    <input v-model="myBox1" type="radio" value="pineapple"/>
    {{myBox1}}

    <!--v-model下拉框的事件绑定-->
    <!--版本一-->
   <!-- <select v-model="selection">
       <option value="1">1</option>
       <option value="2">2</option>
       <option value="3">3</option>
    </select>
    {{selection}}-->

    <select v-model="selection">   <!--版本二-->
      <option v-for="item in selectOption" v-bind:value="item.value">{{item.text}}</option>

    </select>
    {{selection}}

  </div>
</template>

<!--<script>
export default {
  name: 'app'
}
</script>-->
<!--导入组件-->
<script>
  /* eslint-disable */
  import Vue from 'vue'
  import Hello from './components/Hello'
  import componeta from './components/a.vue'

export default {
   /* name: 'app',
    components: {
      Hello
    },*/
   components:{
       componeta
   },
    data(){
      return{
        myValue:'',
        myBox:[],
        myBox1:[],