首页 > 解决方案 > Vue Js中如何将动态函数名传递给点击事件

问题描述

有什么方法可以从参数中传递函数名吗?

像这样的东西..

<tr v-for="item in items" class="static" 
    v-bind:class="{'evenRow': item.oddeven=='1', 'oddRow': item.oddeven=='0' }"
@click="item.click(item.contactID)" >

</tr>  

item.click 在渲染页面时没有转换为相应的函数。什么是正确的方法任何建议将不胜感激?

标签: vue.jsdynamicform

解决方案


要使用动态函数调用,建议有一个辅助函数来接收函数名称并调用相应的函数。

handle_function_call(function_name) {
    this[function_name]()
},

从模板中迭代项目时,您可以通过传递函数名称来调用该函数,例如

<button v-for="button of items"
       :key="button.id" 
       @click="handle_function_call(button.fn_name)" //=> note here
>
  {{ button.text }}
</button>

在 jsfiddle中查看它的实际效果


推荐阅读