2017-09-18 2 views
1

私はVueJS 2.3.0を使用して、ユーザーがメニューをクリックしたときに画像やその他の情報を変更しています。

メニューがVueJSテンプレートでJSONデータソースから生成されます。ここでは

<template id=\"rac-menu\"> 
    <ul class=\"col-md-3\" v-show=\"!ajanlatkeres\"> 
     <li v-for=\"model in models\" model=\"model\"> 
      <a href=\"javascript:;\" 
       class=\"rac_setactive\" 
       v-on:click=\"setActive(\$event)\" 
       :data-id=\"model.id\"> 
        {{ model.name }} 
      </a> 
     </li> 
    </ul> 
</template> 

はVueJSスクリプトコードです:Chromeの場合

Vue.component('racmenu', { 
    template: '#rac-menu', 
    data: function() { 
     var models = {}; 
     for (var id in rac_data) { 
      models[id] = {}; 
      models[ id ]['id'] = id; 
      models[ id ]['name'] = rac_data[id].modell; 
     } 
     return {models: models}; 
    }, 
    props: ['model','ajanlatkeres'], 
    methods: { 
     setActive: function(e) { 
      bus.\$emit('set-rac-content', e.path[0].dataset.id); 
     }, 
    } 
}); 

は細かい何もかもが作業していて、SafariとFirefoxでさ私はエラー:TypeError: e.path is undefinedを得る。

どうすればこの問題を解決できますか?

答えて

3

e.pathはクロムのみの属性です。それが動作しない場合 その($イベント)... htmlのコールのsetActiveでthis質問

1

で 見唯一のsetActiveないcomposedPathがあるe.target

で[0] e.pathを交換してみてください

setActive: function(e) { 
    bus.\$emit('set-rac-content', e.target.path[0].dataset.id); 
} 

<a href=\"javascript:;\" 
    class=\"rac_setactive\" 
    v-on:click=\"setActive\" 
    :data-id=\"model.id\"> 
    {{ model.name }} 
</a> 

機能使用中:デフォルトで

関連する問題