Vue.js使用v-for与v-if实现下拉列表框选中

后台数据：

/*员工列表页js*/
var zuulUrl = 'http://127.0.0.1:8001/';

var httpurlOa  = zuulUrl+'fh-oa/';



//获取从员工列表页面传过来的员工id
var id = sessionStorage.getItem("id");
alert(id);





var vm = new Vue({
    el: '#lasttest',     //使用vue的页面模块

    data:{

        pd: [],	//存放员工信息
        deptList: [] //存放部门信息
      

    },



    methods: {

        //初始执行
        init() {

            this.getEmp();

        },

 
        //获取列表
        getEmp: function(){



            $.ajax({
                xhrFields: {
                    withCredentials: true
                },
                type: "POST",
                url: httpurlOa+'psndoc/findPsbdocById',  //地址
                data: {id:id,tm:new Date().getTime()},  //所需参数
                dataType:"json",
                async: true,
                success: function(data){


                    /*alert(data.result);*/
                    if("success" == data.result){


                       


                     //获取部门信息
                        vm.deptList = data.deptList;

                  //获取员工信息
                        vm.pd = data.pd;






                    }else if ("exception" == data.result){
                        alert('后台程序异常');
                    }
                }
            })
        }


    },


    mounted(){
        this.init();
    }
})

后台获取的数据：
部门集合："deptList":[{"id":"1","dept_name":"综合部","dept_code":"01","pk_psndoc":null,"memo":null},{"id":"2","dept_name":"研发部","dept_code":"02","pk_psndoc":null,"memo":null}]
员工信息："pd":{"birthday":"1984-10-11","social_time":"2016-12-06","dept_id":"3"}

前台

 <select  id="dept">

                                                            <option  value="0">请选择部门</option>
                                                            <template v-for="(data,index) in deptList">//循环部门集合

                                                            <option v-if="pd.dept_id==data.id" selected="selected" v-bind:value="data.id" >
                                                         {{ data.dept_name }}
                                                            </option>
                                                            <option v-else v-bind:value="data.id">{{ data.dept_name }}</option>
                                                            </template>





                                                        </select>