更新记录

1.0.1（2022-06-17）

v1.0.1:2022-06-17

解决搜索样式iphone6兼容问题

v1.0.0 ：2022-06-01

顶部菜单选择，选择后显示取消按钮，支持一级菜单选择，时间选择，内容搜索。

2.0（2022-06-17）

v1.0.0 ：2022-06-17 顶部菜单选择，选择后显示取消按钮，支持一级菜单选择，时间选择，内容搜索。

平台兼容性

link-menu-top ---顶部菜单选择样式

作者：link 联系QQ:427720037

顶部菜单选择，选择后显示取消按钮，支持一级菜单选择，时间选择，内容搜索。 目前组件已经过PC、H5和微信小程序测试通过，其他端未经测试，或许都可以使用。

参数说明

• 必选参数：

  :menulist="menulist" --- 整体菜单对象，请参考菜单示例

  @callback="selectCallBack" ---菜单选择后的回调函数

• 可选参数：

  :search="true" :value ---是否显示搜索图标，默认不显示

  :value="params.searchValue" ---获取搜索关键字

使用说明

<link-menu-top :menulist="menulist" @callback="selectCallBack" :search="true" :value="params.searchValue" />

 <script>
    import LinkMenuTop from "@/uni_modules/link-menu-top/components/link-menu-top/link-menu-top.vue";
    export default {
        data() {
            return {
                msg: "",
                params: {
                    pageNumber: 1, //当前页码
                    pageSize: 20, //分页大小
                    searchValue: ""
                },
                //菜单示例
                menulist: [{
                        "name": "status",
                        "title": "状态",
                        "type": "string",
                        "show": false,
                        "selected": false,
                        "list": [{
                            "name": "未支付",
                            "value": "0",
                            "selected": false
                        }, {
                            "name": "已支付",
                            "value": "1",
                            "selected": false
                        }, {
                            "name": "已发货",
                            "value": "3",
                            "selected": false
                        }, {
                            "name": "已收货",
                            "value": "4",
                            "selected": false
                        }]
                    },
                    {
                        "name": "isFirst",
                        "title": "首次",
                        "type": "string",
                        "show": false,
                        "selected": false,
                        "list": [{
                            "name": "是",
                            "value": "true",
                            "selected": false
                        }, {
                            "name": "否",
                            "value": "false",
                            "selected": false
                        }]
                    },
                    {
                        "name": "source",
                        "title": "来源",
                        "type": "string",
                        "show": false,
                        "selected": false,
                        "list": [{
                            "name": "link",
                            "value": "0",
                            "selected": false
                        }, {
                            "name": "线上",
                            "value": "1",
                            "selected": false
                        }, {
                            "name": "线下",
                            "value": "2",
                            "selected": false
                        }]
                    },
                    {
                        "name": "createDate",
                        "title": "下单时间",
                        "type": "date",
                        "show": false,
                        "selected": false,
                        "list": []
                    },
                    {
                        "name": "search",
                        "title": "搜索",
                        "type": "search",
                        "show": false,
                        "selected": false,
                        "list": [{
                            "name": "姓名",
                            "value": "1",
                            "selected": false
                        }, {
                            "name": "地址",
                            "value": "2",
                            "selected": false
                        }, {
                            "name": "电话",
                            "value": "3",
                            "selected": false
                        }]
                    }
                ]
            };
        },
        components: {
            LinkMenuTop
        },
        onLoad() {},
        methods: {
            selectCallBack(menulistChild, searchValue) {
                //获取返回的搜索值
                this.params.searchValue = searchValue;
                this.menulist = menulistChild;
                this.getList();
            },
            //组装请求参数
            getParams() {
                this.menulist.forEach((item) => {
                    switch (item.name) {
                        case "status":
                            this.params["status"] = "";
                            item.list.forEach((item2) => {
                                if (item2.selected) {
                                    this.params["status"] = item2.value;
                                }
                            });
                            break;
                        case "isFirst":
                            this.params["isFirst"] = "";
                            item.list.forEach((item2) => {
                                if (item2.selected) {
                                    this.params["isFirst"] = item2.value;
                                }
                            });
                            break;
                        case "source":
                            this.params["source"] = "";
                            item.list.forEach((item2) => {
                                if (item2.selected) {
                                    this.params["source"] = item2.value;
                                }
                            });
                            break;
                        case "createDate":
                            this.params["startDate"] = item.list[0] ?? "";
                            this.params["endDate"] = item.list[1] ?? "";
                            break;
                        case "search":
                            this.params["search"] = "";
                            item.list.forEach((item2) => {
                                if (item2.selected) {
                                    this.params["search"] = item2.value;
                                }
                            });
                            break;
                    }
                });
            },
            //获取列表
            getList() {
                this.getParams();
                //this.msg=JSON.stringify(this.params)
                //此处可以请求服务器接口获取数据，可以将组装过的参数this.params传给接口
                //......
            }
        }
    }
</script>

更新说明

v1.0.1:2022-06-17

解决搜索样式iphone6兼容问题

v1.0.0 ：2022-06-01

顶部菜单选择，选择后显示取消按钮，支持一级菜单选择，时间选择，内容搜索。