Javascript vue js在元素上应用动画功能

如何在vuejs中的元素上应用

.animate

函数

<aside v-transition v-if="toggleMenu">
  <a href="#">Haha</a>
  <a href="#">Nice</a>
  <a href="#">Menu</a>
</aside>  

我试过绑定

style

attribute

<aside v-transition :style="{width: toggleMenu?'toggle':'200px'}">

---

通过vue。
这里有一个更新的代码笔，它使用vue JS在侧边栏上切换CSS类：


以下是旁白：

<aside :class="{ 'open' : sidebarOpen }">

下面是进行切换的Vue组件方法：

toggleSidebar() {
  this.sidebarOpen = !this.sidebarOpen;
}

请务必阅读这篇文章，这很有趣：如果您已经知道上述内容，那么v-transition属性表示这是一个vue指令。您必须了解指令。如果不知道，然后，要使用jquery动画，您必须添加一个类tag@roliroli我必须在哪里包括jquery动画代码？这里有一个更新的代码笔，使用Vue JS在侧边栏上切换CSS类：@officert谢谢；他在工作
aside {
  position: absolute;
  width: 300px;
  height: 100%;
  background: #383838;
  left: -300px;
  top: 0;
  transition: left 0.1s ease-in;
}
aside.open {
  left:0;
}

toggleSidebar() {
  this.sidebarOpen = !this.sidebarOpen;
}