vue.js未知のエラー：ウェイポイントコンストラクタに渡された要素オプションがありません

Question

視点を使用しようとしました。このメッセージを送信するウェイポイントに値を渡します：キャッチされないエラー：Waypointコンストラクタに渡された要素オプションがありません。このように：私のビューgaleri.vueで

：

<template> 
     <div class="play-top" id="final"> 
     <iframe src="xxxxxxxxx" allowfullscreen autoplay="false"></iframe> 
    </div> 
</template> 


<script> 
    require('waypoints/lib/jquery.waypoints.min.js') 
    var ele 
    var waypoint = new Waypoint({ 
     element: ele = document.getElementById('final'), 
     handler: function(direction) { 
     if (direction == 'down') { 
      $(ele).addClass('muestra') 
     } else { 
      $(ele).removeClass('muestra') 
     } 
     console.log(direction); 
     } 
    }); 
<script> 

任意のアイデア私は、単一のファイルコンポーネントと

Answer 1

間違ってやっているものを、あなたは実際にVueのコンポーネントをエクスポートする必要があります。だからあなたのスクリプトではなく、次のようになります。

<script> 
    require('waypoints/lib/jquery.waypoints.min.js') 
    export default { 
    mounted(){ 
     var ele 
     new Waypoint({ 
     element: ele = document.getElementById('final'), 
     handler: function(direction) { 
      if (direction == 'down') { 
      $(ele).addClass('muestra') 
      } else { 
      $(ele).removeClass('muestra') 
      } 
      console.log(direction); 
     } 
     }); 
    } 
    } 
<script> 

あなたのウェイポイントのスクリプトが実行されますこれは、その後、DOMでテンプレートとをマウントします。