Vue.js：computedに引数を渡せない

速習vue.jsという本を読んでいて、以下のサンプルコードが出てきました：

お題

<!DOCTYPE html>
<html lang="ja">
<body>
  <div id="app">
    <form>
      <label for="name">メールアドレス：</label>
      <textarea v-bind:value="emails.join(';')" v-on:input="emails = $events.target.value.split(';')"></textarea>
    <ul>
      <li v-for:"email in emails">{{ email }}</li>
    </ul>
  </div>
</body>
</html>

new Vue({
  el: '#app',
  data: {
    emails: []    
  }
});

これを算出プロパティとしたほうが良い書き方、と合ったので試してみました。

ダメだったコード

<!DOCTYPE html>
<html lang='ja'>
<head>
<meta charset='UTF-8'/>
<title>騾溽ｿ歎ue.js</title>
</head>
<style>
[v-cloak] {
  display: none;
}
</style>
<body>
<div id='app'>
  <form>
    <textarea v-bind:value="joinedEmail" v-on:input="splitEmails($event.target.value)" cols="80" rows="10"></textarea>
  </form>
  <ul>
    <li v-for="email in emails">{{ email }}</li>
  </ul>
</div>
<script src='https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js'></script>
<script src='./hello.js'></script>
</body>
</html>

var app = new Vue({
  el: '#app',
  data: {
    emails: ['foo@foo.com','bar@bar.com'],
  },
  computed: {
    joinedEmail: function() {
      return this.emails.join(';');
    },
    splitEmails: function(value) {
      this.emails = value.split(';');
    }
  },
  methods: {
  }
});

なぜダメなのかまだ完全に理解できていませんが、computedではそもそも、引数を渡せないみたいです。ちなみにsplitEmails関数をmethodsに移動させると動きます。

動くコード

setterを使うことで実現できました：

<!DOCTYPE html>
<html lang='ja'>
<head>
<meta charset='UTF-8'/>
<title>速習Vue.js</title>
</head>
<style>
[v-cloak] {
  display: none;
}
</style>
<body>
<div id='app'>
  <form>
    <textarea v-bind:value="joinedEmail" v-on:input="splitEmails = $event.target.value" cols="80" rows="10"></textarea>
  </form>
  <ul v-cloak>
    <li v-for="email in emails">{{ email }}</li>
  </ul>
</div>
<script src='https://cdn.jsdelivr.net/npm/vue@2.5.13/dist/vue.js'></script>
<script src='./hello.js'></script>
</body>
</html>

var app = new Vue({
  el: '#app',
  data: {
    emails: ['a@a.com','b@b.com'],
    myval: ''
  },
  computed: {
    joinedEmail: function() {
      return this.emails.join(';');
    },
    splitEmails: {
      set: function(value) {
        this.emails = value.split(';');
      }
    }
  },
  methods: {
  }
});

とりあえず動くようになりましたが、動作原理をちゃんと理解せねば…