无法让 Vue.js 过渡到工作？

Question

我无法从 vue.js（版本 1）过渡到运行。我从他们的网站上获取了他们的代码。应该运行 javascript console.logs!

 Vue.transition('fade', {
      css: false,
      enter: function (el, done) {
        console.log('enter');
      },
      enterCancelled: function (el) {
        console.log('enterCancelled');
      },
      leave: function (el, done) {
       console.log('leave');
      },
      leaveCancelled: function (el) {
        console.log('leaveCancelled');
      }
    });

     var Vue = new Vue({
      el: '#app',
      data: {
        
      }
    });

    <div id="app">
        <p transition="fade">test fade</p>
    </div>

Answer 1

使用 Vue.js' 过渡系统，您可以在 DOM.DOM 中插入或移除元素时应用自动过渡效果。

过渡属性可以与以下一起使用：

v-if
v-show
v-for

试试看：

Vue.transition('fade', {
    css: false,
 enter: function (el, done) {
  console.log('enter');
 },
 enterCancelled: function (el) {
  console.log('enterCancelled');
 },
 leave: function (el, done) {
  console.log('leave');
 },
 leaveCancelled: function (el) {
  console.log('leaveCancelled');
 }
});

var Vue = new Vue({
 el: '#app',
 data: {
  show: false
 }
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.28/vue.min.js"></script>

<div id="app">
     <button @click="show = !show">{{ show ? 'hide' : 'show' }}</button>
        <p v-show="show" transition="fade">test fade</p>
</div>

无法让 Vue.js 过渡到工作？

Can't get Vue.js transition to work?

javascript

vue.js

vue-component