uniapp自定义picker城市多级联动组件 支持多端--h5.app.微信小程序.支付宝小程序... 支持自定义配置picker插件级数 支持无限级 注意事项:插件传入数据格式为children树形格式,内部包含:id.name 参数 类型 描述 默认值 必选 title string 标题 '' 否 layer number 控制几级联动 1 否 data arr 数据 如:[{text: '', adcode: '', children: [{text: '', adcode: ''}]…

介绍 uniapp自定义弹窗组件uniPop,基于uni-app开发的自定义模态弹窗|msg信息框|alert对话框|confirm确认框|toast弱提示框 支持多种动画效果.多弹窗类型ios/android.可以自定义弹窗样式/自定义多按钮及事件/弹窗显示位置.自动关闭秒数.遮罩层透明度及点击遮罩是否关闭 H5/小程序/App三端效果如下,亲测多端效果兼容性一致.(后续大图均展示App端) 用法 ◆ 弹窗uniPop.vue组件两种引入方式 1.在main.js里引入全局组件 import…

uni-app跨端自定义navbar+tabbar组件|沉浸式导航条|仿咸鱼凸起标签栏 在跨端项目开发中,uniapp是个不错的框架.采用vue.js和小程序语法结构,使得入门开发更容易.拥有非常丰富的插件生态.支持编译到h5.小程序及App等多个终端平台. 如上图:编译到h5+小程序+App端效果 ◆ 准备 在项目根目录components下新建ua-navbar和ua-tabbar组件. 在main.js中全局引入组件. // 引入自定义组件 import NavBar from './co…

zhuanzai:  uniapp自定义顶部搜索框兼容微信小程序 自定义组件 navbarvue (胶囊底部高度 - 状态栏的高度) + (胶囊顶部高度 - 状态栏内的高度) = 导航栏的高度 <template> <view class="navbar"> <view class="navbar-fixed"> <!-- 状态栏小程序撑起高度 --> <view :style="{height:sta…

二维码扫描,已经成为当下一款应用不可或缺,同时也是用户习以为常的功能了.uni-app 为我们提供了扫码 API ,直接调用即可. 需求场景 在实际开发中,平台提供的默认扫码界面,并不能满足一些自定义的需求.例如: 非全屏显示 扫码界面文字国际化 扫码框的颜色调整 微信小程序等小程序平台,可以通过 <camera> 组件来实现部分自定义的需求.App 平台需要通过本地 HTML 来实现,即本文要分享的内容. Tips:这里的 App 特指 Android(.apk).iOS(.ipa) 移动应…

最近一直在学习uni-app开发,由于uniapp是基于vue.js技术开发的,只要你熟悉vue,基本上很快就能上手了. 在开发中发现uni-app原生导航栏也能实现一些顶部自定义按钮+搜索框,只需在page.json里面做一些配置即可.设置app-plus,配置编译到App平台的特定样式.dcloud平台对app-plus做了详细说明:app-plus配置,需注意 目前暂支持H5.App端,不支持小程序. 在page.json里配置app-plus即可 { "path": "…

又双叒一个uniapp组件 最近有一个选择地址的需求,就写了一个省市区联动选择器. 选择日期使用的picker,就照着它简单的整了一个,使用网络请求城市数据,还用到了vuex组件数据共享. 本来自己整了一个底部弹窗,又在插件市场看到了更好的底部弹窗 :LuPopupWrapper--弹窗容器, 所以就用了这个. 依然发布到了插件市场:http://ext.dcloud.net.cn/plugin?id=708 看一下效果吧 具体实现 css就不贴出来了,下载可以看到. 第一.底部弹出框 <vie…

在我眼里自定义导航分2类: 原生基础上 || 非原生基础上 总结:项目当中能原生就原生,提高性能 区别 uni-app 自带原生导航栏,在pages.json里配置. 原生导航的体验更好,渲染新页面时,原生导航栏的渲染无需等待新页面dom加载,可以在新页面进入动画开始时就渲染. 原生导航还可以避免滚动条通顶,并方便的控制原生下拉刷新. 通过pages.json的配置,可以简单的.跨端的.高性能的开发业务. 但原生导航栏的扩展能力有限的.尤其是微信下,没有提供太多导航栏的配置. 在App下,pag…

记得当时是在西班牙有这样的一个需求,需要自定义扫码页面,还需要加上西班牙文,当时是在一个组件里面找到了这样的一个方法,全文大部分使用的app端的Native里面的方法,记录一下,跑路了项目代码要删库了 效果图大概是这样的 以下是vue页面代码<template> <view></view></template><script>import { mapState, mapMutations } from 'vuex';var barcode = n…

微信小程序中定义好的几种picker选择器,不管是日期选择器还是地区选择器,或是其他的都只有定死的样式和内容. 但是大多数开发程序的情况下还是需要自己写样式的,或是内容的. 例如: 代码如下: <view class="free-btns" style="margin-top: 10vh;background:none;"> <button class="free-btn" bindtap="toggleDialog&…