zoukankan      html  css  js  c++  java
  • vue三级联动

    <select @change="getArea(province_id,1)" v-model="province_id">
                                  <option value="">请选择省</option>
                                  <option v-for="item in province" :value="item.area_id">{{item.area_name}}</option>
                              </select>
                                <select @change="getArea(city_id,2)" v-model="city_id">
                                  <option value="">请选择市</option>
                                  <option v-for="item in city" :value="item.area_id">{{item.area_name}}</option>
                              </select>
                                <select v-model="country_id">
                                  <option value="">请选择区/县</option>
                                  <option v-for="item in country" :value="item.area_id">{{item.area_name}}</option>
                              </select>
    app = new Vue({
                    el: '#app',
                    data: {
                        province: [],
                        city: [],
                        country: [],
                    },
                    methods: {
                        getArea: function(id, type) {
                            var that = this;
                            flyPost('api/index/getarea', {
                                _ajax: 1,
                                id: id
                            }).then(function(res) {
                                console.log(id);
                                if (res.code == 1) {
                                    if (id == 0) {
                                        that.province = res.data;
                                    } else {
                                        if (type == 1) {
                                            that.city = res.data;
                                        } else if (type == 2) {
                                            that.country = res.data;
                                        }
                                    }
                                } else {
                                    showAlert({
                                        title: '提示',
                                        message: res.msg
                                    });
                                }
                            }.bind(this)).catch(function(err) {
                                //console.log(err);
                            });
                        }
                    },
                    mounted: function() {
                        var that = this;
                        that.getArea(that.id);
                    }
                })
  • 相关阅读:
    DVD X Player 5.5 PRO
    Freefloat FTP Server 1.0漏洞分析
    基于约束的SQL攻击
    Commons-Collections漏洞
    Code-Audit-Challenges-php-2
    GSM Sniffer环境--c118+osmocombb
    XXE (XML External Entity Injection) :XML外部实体注入
    hyperledger fabric学习(1)
    zero to one (4)
    zero to one (3)
  • 原文地址:https://www.cnblogs.com/shark1100913/p/10243165.html
Copyright © 2011-2022 走看看