如何在v-for上绑定动态方法

时间:2019-05-09 13:00:13

标签: javascript vue.js

我正在尝试通过v-for将方法动态分配给模板生成的元素。这些方法将根据给定变量的值进行分配。在这种情况下,它将是变量“ btn.method”。 这可能吗?


var formButtons = new Vue({
    el: "#formButtons",
    data: {
        buttons: [
            {
                id: "login",
                text: "Login",
                method: "submitForm"
            },
            {
                id: "cancel",
                text: "Cancel",
                method: "clearForm"
            }
        ]
    },
    methods: {
        submitForm: function (event) {
            // Some Code
        },
        clearForm: function (event) {
            // Some Code
        }
    },
    template: `
    <div>
        <div class="form-group"  v-for='btn in buttons'>
            <button
                v-bind:id='btn.id'
                v-on:click='btn.method'
            >
                {{ btn.text }}
            </button>
        </div>
    </div>
    `
});

我试图通过字符串传递方法名称,但是它返回以下错误,“ TypeError:e.apply不是函数。”。

我希望每个按钮都有自己的方法,例如:
-登录按钮=> SubmitForm方法
-取消按钮=> clearForm方法

1 个答案:

答案 0 :(得分:2)

您可以尝试:

xcodebuild