大部分列表场景中都需要进行列表筛选，所以需要把下拉做成一个component组件进行选用。

下面是效果图（不是很美观）

项目目录结构如下：

代码如下(代码有点多，但是复制就能运行)

dropdownmenu.js

Component({
   
  properties: {
   
    dropDownMenuTitle: {
   
      type: Array,
      value: [],
    },
    dropDownMenuDistrictData: {
   
      type:Array,
      value:[]
    },
   
    dropDownMenuSourceData: {
   
      type: Array,
      value: []
    },
  },
  data: {
   
    // private properity
    district_open: false, // 区域
    source_open: false, // 来源
    shownavindex: '',
    dropDownMenuDistrictDataRight: {
   },
    selected_district_id: 0,
    selected_district_name: '',
    selected_source_id: 0,
    selected_source_name:''
  },
  methods: {
   
    
    tapDistrictNav: function (e) {
   
      if (this.data.district_open) {
   
        this.setData({
   
          district_open: false,
          source_open: false,
          shownavindex: 0
        })
      } else {
   
        this.setData({
   
          district_open: true,
          source_open: false,
          shownavindex: e.currentTarget.dataset.nav
        })
      }

    },
    tapSourceNav: function (e) {
   
      if (this.data.source_open) {
   
        this.setData({
   
          source_open: false,
          district_open: false,
          shownavindex: 0
        })
      } else {
   
        this.setData({
   
          source_open: true,
          district_open: false,
          shownavindex: e.currentTarget.dataset.nav
        })
      }
    },
  
    selectDistrictItem: function (e) {
   
      var selectedId = e.target.dataset.model.id
      var selectedTitle = e.target.dataset.model.title;
      var selectedValue = e.target.dataset.model.value;
      this.closeHyFilter();
      this.setData({
   
        selected_district_id: selectedId,
        selected_district_name: selectedTitle
      })
      this.triggerEvent("selectedItem", {
    index: this.data.shownavindex, selectedId: selectedId, selectedTitle: selectedTitle, selectedValue: selectedValue})
    },

    selectSourceItem: function (e) {
   
      var selectedId = e.target.dataset.model.id
      var selectedTitle = e.target.dataset.model.title;
      var selectedValue = e.target.dataset.model.value;
      this.closeHyFilter();
      this.setData({
   
        selected_source_id: selectedId,
        selected_source_name:selectedTitle
      })
      this.triggerEvent("selectedItem", {
    index: this.data.shownavindex, selectedId: selectedId, selectedTitle: selectedTitle, selectedValue: selectedValue })
    },

    
    /**关闭筛选 */
    closeHyFilter: function () {
   
      if (this.data.district_open) {
   
        this.setData({
   
          district_open: false,
          source_open: false,
        })
      } else if (this.data.source_open) {
   
        this.setData({
   
          source_open: false,
          style_open: false,
        })
      }
    },
    // 重置
    reset:function(){
   
      this.setData({
   
        selected_district_i:0,
        selected_district_name:'',
        selected_source_id:0,
        selected_source_name:''
      })
      this.triggerEvent("reset")
    },
   
  },
  //组件生命周期函数，在组件实例进入页面节点树时执行
  attached: function () {
   
    
    
  },

})

dropdownmenu.json

{
   
  "component&