0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

【Vue.js】算出プロパティとメソッドの比較

Posted at

#はじめに
こんにちは!
今回は【Vue.js】算出プロパティとメソッドの違いについてアウトプットしていきます!

#算出プロパティとメソッドの違いとは
算出プロパティとメソッドの違いは3点あります。
①算出プロパティ cpmputed ・・・ ()不要
      メソッド methods・・・ ()必要

②getter,setter
・cpmputed・・・getter,setterが必要
・methods・・・getterのみ必要

③キャッシュ
・cpmputed・・・される
・methods・・・されない

#書き方・解説
##①プロパティとメソッド

HTML
  <p>
  {{ reversedMessage }}
  <!-- プロパティ -->
  </p>
  <p>
  {{ reversedMessageMethod() }}
  <!-- メソッド -->
  </p>
Vue.js
  data: {
    message: 'Hello Vue.js!'
  },
  computed: {
    reversedMessage: function() {
      return this.message.split('').reverse().join('')
    }
  },
  methods: {
    reversedMessageMethod: function() {
      return this.message.split('').reverse().join('')
    }
  }

#まとめ
上記のようにプロパティには()不要、メソッドには()必要というふうになります。
②getter,setter、③キャッシュについては別記事で解説します。

#最後に
今回は算出プロパティとメソッドの違いについてアウトプットしました。
今回の記事を読んで質問、間違い等あればコメント等頂けると幸いです。

今後ともQiitaにてアウトプットしていきます!

最後までご愛読ありがとうございました!

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?