Question

我想用Vue.js建立一个简单的SPA。我想加载不同的模板并在它们之间设置过渡动画，如下所示：

http://codepen.io/michaeljcalkins/pen/BNqREZ

示例很棒，但我想从单独的文件中加载每个组件的模板。

类似的东西：

<div class="container">

<div class="row>
    <div id="first" ng-show="condition" class="in-out">Content here...</div>
    <div id="second" ng-hide="condition" class="in-out">Other Content here...</div>
</div>

</div>

<style>

.in-out.ng-hide-add, .in-out.ng-hide-remove {
  transition:1s linear all;
}

.in-out.ng-hide-add {
  //opacity: 0;
}
.in-out.ng-hide-add.ng-hide-add-active {
  opacity: 0;

}
.in-out.ng-hide-remove {
  //opacity: 1;
}
.in-out.ng-hide-remove.ng-hide-remove-active {
  opacity: 1;
}
</style>

我浏览了文档，但似乎找不到任何东西。我将如何实现这样的目标呢？

谢谢！

Answer 1

如上面的Björn所述，看起来在Vue中使用模板URL似乎不太可能。谢谢Björn！

vuejs组件模板文件

1 个答案: