javascript - vueJS中option监听onchange事件？

问题描述

问 题

度娘了好久，发现vuejs的onchange事件用watch去监听，请问如何做到点击选项重新获取新的列表呢?

<script>
    var dataInfo = {}

    function getData(cityid) {
        dataInfo = jq_get_data(cityid)

        if(dataInfo.status == 0) {
            dataInfo.selected = dataInfo.result.bata[0].id //selected default value
            return dataInfo
        } else {
            var tt = dataInfo.msg ? dataInfo.msg : "错误"
            alert_error(tt, "抱歉，无法获取到数据")
        }
    }
    var cityid
    vm = new Vue({
        el: '#app',
        data: {
            feed: "",
            info: {},
            list: {},
            final: {
                msg: ""
            },
            selected: "",
            cityid:""
        },
        watch: {
            selected: function(cityid) {
                //我想通过点击下拉框，获取到option的value值，根据这个id去ajax刷新列表方法
                //但是cityid传不进去，暂时只有重新再定义一个changeInfo ，覆盖掉老的数据
                //或者是否我这个思路整个都不正确，求指点谢谢!
                var changeInfo = getData(cityid)
                this.info = changeInfo.result.bata
                this.list = changeInfo.result.data
                this.selected = cityid
            }
        },
        ready: function() {
            this.getData()
        },
        methods: {
            getData: function(cityid) {
                var defaultInfo = getData()
                this.info = defaultInfo.result.bata
                this.list = defaultInfo.result.data
                this.selected = defaultInfo.result.bata[0].id
            }
        }
    });
</script>

解决方案

看着我都懵了，这是什么意思，选择option，根据选中的选项中的id 或值 再ajax？

这篇关于javascript - vueJS中option监听onchange事件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！