首页 > 解决方案 > 如何检测 vue treeselect 的变化

问题描述

我正在使用 vue treeselect 从下拉列表中选择多个工作日。它运行良好,但我想在进行更改时运行一段代码。我已阅读文档,但不了解如何使用事件。认为我可能需要选择事件。任何帮助表示赞赏!

HTML:

<treeselect :multiple="true"
        :options="options"
        :openOnClick="true"
        :clearable="false"
        :beforeClearAll="false"
        :allowClearingDisabled="true"
        :select="dayChange()" //I know this doesn't work!
        v-model="days" /> <treeselect-value :value="days" />

JS:

vm = new Vue({
        el: ".my-app",
        data: {
            ...,
            options: [
                { id: 1, label: "Monday" },
                { id: 2, label: "Tuesday" },
                { id: 3, label: "Wednesday" },
                { id: 4, label: "Thursday" },
                { id: 5, label: "Friday" },
                { id: 6, label: "Saturday" },
                { id: 7, label: "Sunday" }
            ],
            ...
        },

        methods: {
            dayChange: function () {
                alert("changed");
            },
        }
})

标签: javascriptvue.jsvuejs2vue-componentvue-treeselect

解决方案


您在滥用事件,不应将事件绑定到其处理程序,如下所示:

@select="dayChange"

或者

v-on:select="dayChange"

:绑定符号用于非props事件

在你的方法中你应该有:

   methods: {
            dayChange: function (node, instanceId) {
                alert("changed");
            },
        }

推荐阅读