Vue2.0入门之method和computed

  在Vue中,method和computed所达到的效果是一致的,但在使用上却有所差别,具体体现在:
  1.使用方法上的不同:method可以传参数而computed却不可以
  2.调用方式上的不同:method调用需要加"()",computed则不能加"()",
js代码:

methods:{
        //存储方法
        //没有参数
        sayHello(){
            return 'Hello World!'
        },
        //有参数
        sayWord(word){
            return 'Hello'+word+'!'
        }
    },
    computed:{
        //计算属性
        increseNumber(){
            return ++this.num
        }
    }

html代码:

{{sayHello()}}

{{sayWord('World')}}

{{increseNumber}}

  3.使用情况的不同:
  官方推荐的computed只用来做简单的运算,不应在computed中有过多的逻辑运算使得模板笨重难以维护。个人认为computed适合处理耗时的操作,尤其是虚拟dom和真实dom一致的情况下,method中的方法其中一个任意调用,其他方法都会调用,会消耗多余的资源,computed则不会调用其他方法,但并不意味着computed就一定比method要好,更多的还是要根据不同的场景使用不同的方式。

你可能感兴趣的:(Vue2.0入门之method和computed)