我们在做uni项目开发的时候，经常会遇到要使用一些通用的模块，比如一个弹窗，一组按钮，如果每个页面重复编写，比如会耗费很大的时间，也不利于系统的维护和管理，所以我们有必要把它写成一个通用的模块，以实现任意调用的目的。
所有的组件都会被定义在components目录下，如果您新建的项目中没有这个目录，也可以自己创建，如下就是一个被定义好的组件(shopwind-multpicker)结构:
components/
shopwind-multpicker/
shopwind-multpicker.js
shopwind-multpicker.vue
pages/
static/
App.vue
每个组件就是一个文件夹，定义好组件之后，我们就可以在视图（vue）中调用，代码示例如下：
<shopwind-multpicker :title="title" idField="region_id" nameField="region_name" parentField="parent_id" :selected="selected" @confirm="confirm"></shopwind-multpicker>
这样就完成了一个组件的显示，那么我们如何将组件的值传到父页面的，可以通过在组件（shopwind-multpicker.vue）文件中使用 this.$emit 方法：
// 组件的vue文件
this.$emit('confirm', '返回父页面的结果集')
然后在父页面中，你需要定义跟emit第一个参数名称一致的方法（这里为：confirm）来接收字组件的返回结果，这个方法定义在methods中
// 父页面的vue文件
export default {
data() {
return {}
},
methods: {
confirm(result) {
// 这里可以获取您选择后返回的数据
console.log(result)
}
}
}
这样就完成了一个父子页面的传值，本例中使用了 shopwind-multpicker 组件，该组件是一个支持三级联动的插件，比如地区联动，分类联动，可以支持任意模型的三级联动，效果展示如下
地区分类组件
