将数据从模板传递给 Vue 中的方法答案

【问题标题】：Pass data to methods in Vue from template将数据从模板传递给 Vue 中的方法
【发布时间】：2018-06-28 12:41:42
【问题描述】：

我在我的 visualforce 页面构建中使用 Vue.JS。

我有下面一段 Vue 模板代码，我可以在其中获得 acc.name 打印在页面上。但现在我需要将此值发送到 Vue 应用的 methods 部分中的 addtoterriotry 方法。

请在下面找到我的 Vue 应用程序组件。

<v-dialog v-model="addToTerr" max-width="1000">\
                    <v-card>\
                        <v-card-title class="headline">Review Selected Accounts</v-card-title>\
                        <v-card-text>\
                            <div v-for="acc in this.items" v-if="acc.selected">{{acc.Name}}</div>\
                        </v-card-text>\
                        <v-card-actions>\
                            <v-btn color="secondary" v-on:click="addToTerriotry">Add</v-btn>\
                            <v-btn v-on:click="addToTerr = false">Close</v-btn>\
                        </v-card-actions>\
                    </v-card>\
                </v-dialog>\

addtoterriotry 方法：

   methods: {
                selectDeselectAccount: function (props) {
                    props.item.selected = props.item.selected ? false : true;
                    if (props.item.selected)
                        this.accountsSelected = this.accountsSelected + 1;
                    else
                        this.accountsSelected = this.accountsSelected - 1;
                },
                showaccount: function (props) {
                    this.selectedaccount = props.item;
                    this.accdetails = true;
                },
                addToTerriotry: function () {
                    alert('Invoke Controller Action');
                   // Fetch acc.name value here.
                     CallApexMethod();


                }

【问题讨论】：

标签： methods vue.js vuejs2 vue-component

【解决方案1】：

假设您的意思是您试图访问具有selected 值为true 的acc，只需在addToTerriotry 方法开头的items 数组中找到该元素即可：

addToTerriotry: function () {
  alert('Invoke Controller Action');
  let acc = this.items.find(i => i.selected);
  console.log(acc.name);  
  CallApexMethod();
}

【讨论】：