Vue非典型封装Bootstrap-Select公共组件（异步获取数据，prop自定义函数）

本文重点讨论的问题：

1. 如何统一所有实例数据，而不是实例化组件时传入数据。并非提倡这种做法，结合实际需求。
2. 如何prop组件实例的自定义函数。

以上问题比较鲜见，于是把我的解决思路写下来跟各位分享。完整具体的实现代码就不列出了。

接触VUE时间不长，逐渐了解到它的强大组件功能后，就开始着手将项目中的可以复用的选择框封装成公共组件。
开始的选择并非是Bootstrap-select插件，而是html标准的标签。结合自己的实际需求，决定采用全局组件。遇到的第一个问题便是数据与组件的关系。我们先来看VUE官方文档对组件Data的定义：

data 必须是函数 构造 Vue 实例时传入的各种选项大多数都可以在组件里使用。只有一个例外：data 必须是函数。

理解起来应该不难，为了避免组件实例之间的数据影响，这么做是正确的。但这个做法跟我的实际需求产生了矛盾，我希望我的所有的组件实例都是公用同一套选项数据，数据异步从服务端获取。实际上项目中也确是如此。于是暂定为每个实例定义自己的数据，后期考虑数据从全局变量（字典缓存）获取。

data:function(){
            return {
                flg:false,
                loading: false,
                map:new HashMap(),
                list1:[],
                list2:[],
                ...
            }
        }

增加的loading标识是为了良好的用户体验，在等待异步获取数据期间告知用户加载中。

template: '<div class="col-sm-8" v-if="loading">'
         +'</div>'
         +'<div class="col-sm-8" v-else>'
                +'加载中...