uniapp 仿微信的右边下拉选择弹出框的实现代码

网络编程 2024/12/23 佚名

3 1 2

在百度找了很多没有找到满意的这里根据自己的需求抽取一个组件

这个组件主要是包括搜索框和右边菜单点击弹出一个下拉筛选菜单

这里首先用一个单独的页面存放这个组件

<template>
//这里是搜索框的输入框 不需要的可以删掉
 <view>
 <view class="arrivalSearch">
  <view class="arrivalSmallsearch">
   <view class="arrivalSearchInput">
   <input type="text" :placeholder="dateinit">
   </view>
   //这里是输入框旁边的图标（这里的图标是一张图片）
   <image src="/UploadFiles/2021-04-02/nav.png">

然后在main.js中引入页面




import springBox from 'pages/springBox/springBox'
Vue.component('springBox',springBox)



最后直接在需要使用的页面使用组件就可以了




<springBox></springBox>

uniapp,下拉选择弹出框,uniapp,仿微信下拉弹出框

华山资源网 Design By www.eoogi.com

广告合作：本站广告合作请联系QQ：858582 申请时备注：广告合作（否则不回）
免责声明：本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除！