事件绑定

依然用app.vue练手

首先先写事件发生时所调用的方法

export default {
  data () {
    return {
      list: [
        {
          label: '第一个',
          state: true
        },
        {
          label: '第二个',
          state: false
        }
      ]
    }
  },
  // 下面是新加的
  methods: {
    clickli: function (item) {
      item.state = !item.state;
    }
  }
}

data里面写的只是返回的数据，可以是空；
事件触发的方法或者其他方式所用到的方法，基本都放在methods里面，说“基本都放在”的原因是，我只是渣渣切图仔，并没有全面透彻的了解，所以我不知道是否有放外面的…

在html对应部分，做事件绑定

既然方法写了，那么就要去写触发了

<template>
  <div id="app">
    <ul>
      <li v-for="item in list" v-on:click="clickli(item)">
        {{ item.label }}
      </li>
    </ul>
  </div>
</template>

在vue中，事件绑定用的是v-on，它有多种写法（我没数，反正>1种），这里用完整写法，有简写，大家可以多翻看API。我这里不写，就是为了让你们多翻看API。
本期结束了。