Vue.js计算机属性computed和methods方法详解-创新互联

在使用Vue.js时，会发现调用menthods里的方法也可以与计算机属性起到同样的作用，如：

成都创新互联公司从2013年成立，先为攀枝花等服务建站，攀枝花等地企业，进行企业商务咨询服务。为攀枝花企业网站制作PC+手机+微官网三网同步一站式服务解决您的所有建站问题。

<div id="app">
 
 <!--利用计算机属性实现逆向文本的效果-->
 <input type="text" v-model="text" property="请输入要逆转的文本/>
 <!--逆转的方法-->
 <h4>计算机属性逆转：{{reversedText}}</h4>
 <!--通过调用methods里的方法也可以与计算机属性起到同样的作用-->
 <!--注意，方法要带'()'-->
 <h4>方法逆转：{{reversedTextM()}}</h4>
 
</div>
<script>
 var app = new Vue({
  el: '#app',
  data: {
  text: '123,456'
  },
  methods: {
  reversedTextM: function () { 
   return this.text.split(',').reverse().join(',');
  },
  },
  computed: {
  reversedText: function () { //翻转文本的方法
   //这里的this指向当前Vue实例
   return this.text.split(',').reverse().join(',');
  }
  }
 });
</script>

当前文章：Vue.js计算机属性computed和methods方法详解-创新互联
分享网址：https://www.cdcxhl.com/article2/hjgic.html

成都网站建设公司_创新互联，为您提供网站改版、自适应网站、ChatGPT、网站设计公司、营销型网站建设、网站制作

声明：本网站发布的内容（图片、视频和文字）以用户投稿、用户转载内容为主，如果涉及侵权请尽快告知，我们将会在第一时间删除。文章观点不代表本网站立场，如需处理请联系客服。电话：028-86922220；邮箱：631063699@qq.com。内容未经允许不得转载，或转载时需注明来源：创新互联

猜你还喜欢下面的内容