现在要点击a标签调用到JS的方法,到时由于是是使用vue.js语法,所以想要用到JS的方法首先要用到vue的实例。

而现在以下的代码的点击事件,是调用vue实例里面的方法。

<div class="right" id="right">
  <ul>
    <li v-for="item in items">
      <div v-for="ite in item.list">
        <div style="height:20px;">
          <a @click="vue_addToCart(ite.id)">点击调用方法</a>
        </div>
      </div>
    </li>
  </ul>
</div>

以下代码为vue的实例,而JS的方法,要在vue的实例里面的methods的方法里面去调用,也就是说上面调用的vue的方法要写在methods里面,而里面的那个方法,再去调用JS方法,才能够生效

<script type="text/javascript">
var right = new Vue({
  el: '#right',
  data: {
    items: {$newsidebarProds}
  },
  methods: {  
      vue_addToCart: function (id) { 
      console.log('id:',id); 
         addToCart(id);
      }  
  } 
});
</script>


以下代码为被调用的JS方法

<script type="text/javascript">
function addToCart(id){
  alert('调用成功');
}
</script>

现在点击一下a标签,就能触发了。

Logo

前往低代码交流专区

更多推荐