vuejs组件模板文件

时间:2015-11-01 16:04:11

标签: javascript single-page-application vue.js

我想用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>

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

谢谢!

1 个答案:

答案 0 :(得分:0)

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

相关问题