Vue.js学习与入门(三)计算属性

mac2025-04-19  1

在Vue中的computed选项中,定义了一个计算属性reversedMessage,它提供的函数将作为属性reversedMessage的getter方法,返回变量message反转后的字符串,通过

{{resversedMessage}}

显示出来。

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"/> <script type="text/javascript" src="js/vue.js"></script> </head> <body> <div id="app"> {{reversedMessage}} </div> <script> var app = new Vue({ el:'#app', data:{ message:'Hello Vue!' }, computed:{ //计算getter reversedMessage: function(){ //this指向当前Vue的实例 return this.message.split('').reverse().join(''); } } }) </script> </body> </html>

 

最新回复(0)