因项目需要，最近用vue写了个二级联动，刚开始用vue不熟悉，收集了两种方法，这也是我借鉴别人的文章和思路才写出来的，其实没什么区别，可以参考下：

    
  
                 {
   {yx.text}}        
                 {
   {zy.text}}      
    

这是第一种方法的js部分代码：

new Vue({  el: '#test',  data: {    selected: '计信院',    YX: [{      text: '计信院',      ZY: [{        text: '软件工程'      }, {        text: '计算机科学与技术'      }, {        text: "信息安全"      }, ]    }, {      text: '商学院',      ZY: [{        text: '旅游管理'      }, {        text: '工商管理'      }, {        text: "行政管理"      }, ]    }, ]  },  computed: {    selection: {      get: function() {        var that = this;        return this.YX.filter(function(item) {          return item.text == that.selected;        })[0].ZY;      }    }  }});

以上是一种方法，总体来说还不错，而且默认有第一项，无需在写默认项。

    
    
                         {
   {yx.text}}                
                         {
   {zy.text}}            
    

这是第二种方法的js部分代码：

var vm = new Vue({    el:'#test',    data:{        YX:[            {                text:'计信院',                ZY:[                    {text:'软件工程'},                    {text:'计算机科学与技术'},                    {text:"信息安全"},                ]            },            {                 text:'商学院',                ZY:[                    {text:'旅游管理'},                    {text:'工商管理'},                    {text:"行政管理"},                ]            },               ]    },    computed:{        selection: function() {            for (var i = 0; i < this.YX.length; i++) {                if (this.YX[i].text === this.A) {                    return this.YX[i].ZY;                }            }        }    }});

总体来说，两种方法都可以，都值得借鉴一下