@changeイベントを使用したコード例

@changeを使用したコード例です。この例では、入力フィールドの値が変更されたときに、その値をコンソールに出力する関数を呼び出します。

<div id="app">
  <input type="text" @change="handleChange" placeholder="テキストを入力してください">
</div>

<script>
  var app = new Vue({
    el: '#app',
    methods: {
      handleChange: function(event) {
        console.log('入力値が変更されました:', event.target.value);
      }
    }
  });
</script>

このコードでは、<input>要素に@changeディレクティブを使用して、handleChangeメソッドを呼び出します。@changeディレクティブは、入力フィールドの値が変更されたときにトリガーされ、そのときのイベントオブジェクトがhandleChangeメソッドに渡されます。handleChangeメソッドでは、コンソールに入力値が出力されます。

このようにして、@changeを使用することで、フォームの入力値が変更されたときに特定のアクションを実行することができます。