代码之家 › 专栏 › 技术社区 › ÐÐ»ÑÑ ÐÐµÐ»ÐµÐ½Ñ

有没有办法在模板中获得动态名称的方法?[副本]

vue-component vuejs2 methods vue.js templates

0

ÐÐ»ÑÑ ÐÐµÐ»ÐµÐ½Ñ · 技术社区 · 6 年前

像这样的东西。。

<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>

项。单击在呈现页面时,未将转换为相应的函数。

0 回复 | 直到 7 年前

1

20

Roland 7 年前

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

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>

in jsfiddle

2

1

Anoop chaudhary 7 年前

@单击=“[fuctionName]($event,index)”

例子:

<button v-for="(button,index) in items" @click="[fuctionNames[index]]($event, index)" > // consider fuctionNames array of Function Names.

3

0

Emtiaz Zahid 7 年前

您可以通过事件传递数据

或者,使用v-model获取一个只读输入字段

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

</tr>  

new Vue({
  ...
  ...
  methods:{
    itemClick:function(event){
       console.log(event.target.value);
    }
  }
})