v-if 行为不同：从 vue 项目 1.x 到 2.x 迁移

在我的 vue 项目中，我正在尝试从 1.x 升级到 2.x。我遇到了如下问题：

<div id="demo">
  <service :service-name="serviceName" ref="testcomp" v-if="runTest"></service>
</div>

在子组件上service，我v-if用来控制它的存在。在父组件中，我想用来this.$refs.testcomp调用test子组件中定义的方法，如下所示：

  methods: {
    init() {
        this.runTest = true;
    },
  },
  mounted() {
    this.init();
  },
  watch: {
    runTest() {
        if(this.runTest)  {
        console.log('1');
        this.$refs.testcomp.test();
        console.log('2');
      }
    },
  },

但是错误消息说这this.$refs.testcomp是未定义的。我用 jsfiddle 创建了现场演示：https ://jsfiddle.net/baoqger/0r4vby5n/1/

但是在 vue1.x 中，它可以很好地工作。https://jsfiddle.net/baoqger/fzuajwkz/1/

我知道改成 v-show，可以跳过这个问题。但是在我的实际项目中（这是一个大项目，由其他人开发。所以如果我将v-if更改为v-show，它会引发其他与工作流程相关的问题）。那么有什么办法可以让v-if在升级后的版本中仍然有效。