Vue.js 算出プロパティとメソッド
<div id="app">
<p>Reversed message: "{{ reverseMessage() }}"</p>
</div>
// 算出プロパティを使ったほうが良い
// - 算出プロパティはリアクティブな依存関係に基づきキャッシュされる
// ↓ メソッドの場合
// - 常に関数を実行する
new Vue({
el: '#app',
data: {
message: 'Hello'
},
methods: {
reverseMessage: function () {
return this.message.split('').reverse().join('')
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>