如何在v-if标记内触发方法(不使用v-on)?

时间:2017-09-09 15:37:06

标签: vue.js vuejs2

我有一个带有v-if条件的模板标签。我希望在此条件为真时触发方法。类似的东西:

<template v-if="condition">
    {{ doit() }} //trigger method
</template>

我想在条件为真时调用doit方法。我怎样才能做到这一点?

1 个答案:

答案 0 :(得分:1)

如果您要调用的方法不对DOM执行任何操作,我建议您将其移出模板,可能是移动到观察者。像这样:

&#13;
&#13;
09-09 14:59:11.002 2650-2650/com.example.fdai3744.t_online20 E/AndroidRuntime: FATAL EXCEPTION: main
                                                                               Process: com.example.fdai3744.t_online20, PID: 2650
                                                                               java.lang.RuntimeException: Unable to start activity ComponentInfo{com.example.fdai3744.t_online20/com.example.fdai3744.t_online20.SecondActivity}: java.lang.NullPointerException: Attempt to invoke virtual method 'void android.support.v4.view.ViewPager.setAdapter(android.support.v4.view.PagerAdapter)' on a null object reference
                                                                                   at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2665)
                                                                                   at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2726)
                                                                                   at android.app.ActivityThread.-wrap12(ActivityThread.java)
                                                                                   at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1477)
                                                                                   at android.os.Handler.dispatchMessage(Handler.java:102)
                                                                                   at android.os.Looper.loop(Looper.java:154)
                                                                                   at android.app.ActivityThread.main(ActivityThread.java:6119)
                                                                                   at java.lang.reflect.Method.invoke(Native Method)
                                                                                   at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:886)
                                                                                   at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:776)
                                                                                Caused by: java.lang.NullPointerException: Attempt to invoke virtual method 'void android.support.v4.view.ViewPager.setAdapter(android.support.v4.view.PagerAdapter)' on a null object reference
                                                                                   at com.example.fdai3744.t_online20.SecondActivity.onCreate(SecondActivity.java:41)
                                                                                   at android.app.Activity.performCreate(Activity.java:6679)
                                                                                   at android.app.Instrumentation.callActivityOnCreate(Instrumentation.java:1118)
                                                                                   at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2618)
                                                                                   at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:2726) 
                                                                                   at android.app.ActivityThread.-wrap12(ActivityThread.java) 
                                                                                   at android.app.ActivityThread$H.handleMessage(ActivityThread.java:1477) 
                                                                                   at android.os.Handler.dispatchMessage(Handler.java:102) 
                                                                                   at android.os.Looper.loop(Looper.java:154) 
                                                                                   at android.app.ActivityThread.main(ActivityThread.java:6119) 
                                                                                   at java.lang.reflect.Method.invoke(Native Method) 
                                                                                   at com.android.internal.os.ZygoteInit$MethodAndArgsCaller.run(ZygoteInit.java:886) 
                                                                                   at com.android.internal.os.ZygoteInit.main(ZygoteInit.java:776) 
&#13;
var app = new Vue( {
  el: '#app',
  data: {
    val1: 1,
    val2: 0
  },
  watch : {
    val1: function() {
      this.val2++;
    }
  }
});
&#13;
&#13;
&#13;