uView 第2页

uview 瀑布流_微信小程序瀑布流最好最简单的解决方案

网上能搜到的小程序瀑布流解决方案，要么代码复杂、逻辑混乱，要么实现不了业务功能，所以把我在项目中的实现方案给大家分享下。最简单的实现方案，不适用有分页的场景。这个方案简单的原因是因为仅仅使用了css的属性。使用column-count属性可以指定页面显示的列数，一般瀑布流都是2列，所以可以定义class.list-masonry{column-count:2;//2列column-gap:20rp

杂志社社内刘编辑·2024-01-19 22:31

uniapp (UI框架：uview2.x) JSON数据导出生成excel

一、生成下载的表格模板数据代码如下：//建立一个工具类函数文件utils.jsexportfunctiontableToExcel(jsonData,str){//要导出的json数据letworksheet='sheet1'//letstr='姓名电话邮箱'//循环遍历，每行加入tr标签，每个单元格加td标签console.log('jsonData:',jsonData);for(leti=0

Echo-潔·2024-01-19 17:15

使用的uview 微信高版本头像昵称填写能力

一键登录邀请您补全个人信息头像昵称取消确定暂不登录importavatarUrlfrom"@/static/logo.png"exportdefault{data(){return{avatarUrl:avatarUrl,nickName:'',token:'',imgList:[],show:false,}},methods:{back(){uni.navigateBack({delta:1,}

又是取名的一天·2024-01-19 15:44

uniapp中uview组件库TopTips 顶部提示使用方法

目录#平台差异说明#基本使用#自定义导航栏使用本组件的问题#主题设置#显示时间设置#API#Methods#Props该组件一般用于页面顶部向下滑出一个提示，尔后自动收起的场景。#平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用该组件通过ref调用，使用简单，只需title参数设置显示的内容即可注意：不要在onLoad中调用，应在onReady生命

TechWhiz-晓同·2024-01-19 07:44

uniapp中uview组件库Toast 消息提示的使用方法

目录#基本使用#配置toast主题#toast结束跳转URL#API#Props#Params#Methods此组件表现形式类似uni的uni.showToastAPI，但也有不同的地方，具体表现在：uView

TechWhiz-晓同·2024-01-18 15:03

uniapp中uview组件库的NoticeBar 滚动通知使用方法

目录#平台差异说明#基本使用#配置主题#配置图标#配置滚动速度#控制滚动的开始和暂停#事件回调#API#Props#Events该组件用于滚动通告场景，有多种模式可供选择#平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用通过list数组参数设置需要滚动的内容滚动mode参数有两种模式，分别是horizontal水平滚动，vertical垂直滚动。其

TechWhiz-晓同·2024-01-18 15:03

#Uniapp：uni-app加载全局组件的方法easycom

.*)":"@/uni_modules/uview-ui/components/u-$1/u-$1.vue","^uni-app-(.*)":"@/components/c-$1-$1/c-$1-$1.

前端xiaolibao·2024-01-18 12:21

HBuilder X中uView UI框架的安装及使用

在最上方的工具中点击插件安装——>安装新插件——>前往插件市场安装在作者排行榜中找到uViewUI选择该版本然后点击下载并导入HBuilderX然后选择你想导入的项目在项目根目录中的main.js中，引入并使用uView

B·O·P·2024-01-18 11:33

uniapp 引入 uview 以及各文件夹用途 (1)

uniapp教程太多了就不从头开始讲了这里推荐一篇质量高些的大佬大家可以从零参考他uniapp从入门到精通然后我只是简单记录一下我当时学习uniapp的一些问题和经验(单纯没什么可写了,混时长)这里是uview

CV工程师!!·2024-01-18 09:15

uview2.0 【uniapp】购物车样式

明星同款越野机能鞋子轻便舒适黑色,40码￥{{item.price|fixed}}全选({{chooseNum}})合计:{{totalPrice|fixed}}立即下单exportdefault{components:{},data(){return{radioVal:false,cart_ids:[],//选中的/*checked：是否选中show：控制打开或者关闭（移除按钮）*/list:[

嘿，小苹果·2024-01-18 00:02

uView折叠面板修改版

写了一个折叠面板，代码如下全选{{item.name}}（已选择：{{item.selectedLength?item.selectedLength:0}}/{{item.children.length}}）{{children.peopleName}}{{children.address}}已选择选择exportdefault{data(){return{collapseList:[{name:

一朵盆栽·2024-01-17 02:22

【uview2.0】Keyboard 键盘与 CodeInput 验证码输入结合使用 uview

https://www.uviewui.com/components/codeInput.html（CodeInput验证码输入）https://www.uviewui.com/components/keyboard.html（Keyboard键盘）//按键被点击(不包含退格键被点击)changeFun(e){//最多输入6为数字if(this.value.length>=6){return;}t

嘿，小苹果·2024-01-16 15:51

uniCloud + uView 上传图片（u-upload 组件的使用）

::v-deep.u-upload__button{width:100%!important;}::v-deep.u-upload__wrap__preview__image{width:100%!important;}::v-deep.u-upload__wrap__preview{width:100%!important;}fileList:[],uploadOK(e){this.fileLi

朝阳39·2024-01-15 12:22

uniapp中uview组件库的AlertTips 警告提示使用方法

目录#使用场景#平台差异说明#基本使用#图标#可关闭的警告提示#API#Props#Events警告提示，展现需要关注的信息。#使用场景当某个页面需要向用户显示警告的信息时。非浮层的静态展现形式，始终展现，不会自动消失，用户可以点击关闭。#平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用通过title和description设置组件的标题和描述内容

TechWhiz-晓同·2024-01-14 05:57

uniapp uview 中阻止switch开关的事件冒泡

在做项目的时候遇到了switch和祖父元素事件冒泡的问题。刚开始想的解决办法是在change里面加e.preventDefault来阻止，然鹅不生效。就抱着试一试的方法在switch的父元素加上stop试试，竟然成功了。在switch的父标签加@tap.stop.prevent阻止事件冒泡。本文转载自：https://blog.csdn.net/qq_43272035/article/detail

辰聂·2024-01-13 18:00

uniapp 查找不到uview-ui文件怎么办？

用官方的方式总是报：文件查找失败：'uview-ui'atmain.js解决方案：1.先安装uview-uinpminstalluview-ui下载成功是这样的：而不是这样的：这样的原因是你的项目里没有

茶茶只知道学习·2024-01-13 13:48

uView框架中DatetimePicker选择器设置默认值

需求是页面显示的哪天日期点开就是哪天的日期uview的文档有个defaultIndex属性设置各列的默认索引，但是使用发现无效果解决方案：使用innerValue1.给选择器添加ref2.在点击显示日期弹框的地方使用

mmmmmmmmmmmy·2024-01-13 07:53

uniapp中uview组件库丰富的ActionSheet 操作菜单使用方法

目录#平台差异说明#基本使用#配置顶部的提示信息和底部取消按钮#如何知道点了第几项#API#Props#Event本组件用于从底部弹出一个操作菜单，供用户选择并返回结果。本组件功能类似于uni的uni.showActionSheetAPI，配置更加灵活，所有平台都表现一致。#平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用通过list设置需要显示的

TechWhiz-晓同·2024-01-12 09:48

uniapp中uview组件库丰富的CountDown 倒计时使用方法

目录#平台差异说明#基本使用#设置是否显示天，时，分，秒#倒计时分隔符#倒计时样式#倒计时执行的时机#如何获取当前倒计的秒数#API#Props#Events#Methods该组件一般使用于某个活动的截止时间上，通过数字的变化，给用户明确的时间感受，提示用户进行某一个行为操作。#平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用通过timestamp

TechWhiz-晓同·2024-01-12 09:18

uniapp中uview组件库丰富的CountTo 数字滚动使用方法

目录#平台差异说明#基本使用#设置滚动相关参数#是否显示小数位#千分位分隔符#滚动执行的时机#API#Props#Methods#Event该组件一般用于需要滚动数字到某一个值的场景，目标要求是一个递增的值。注意如果给组件的父元素设置text-align:center想让数字水平居中，可能是由于元素内容快速变化而导致渲染的问题，在APP上组件可能会有轻微的左右抖动现象，解决办法是给父元素设置pad

TechWhiz-晓同·2024-01-12 09:18

uView Avatar 头像

本组件一般用于展示头像的地方，如个人中心，或者评论列表页的用户头像展示等场所。#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过src指定头像的路径即可简单使用，如果传递了text参数，text将会优先起作用注意：请保证传递给src的是绝对地址，而不是相对地址，为什么呢？因为传入avatar组件的相对地址，是相对于组件的，而不是父组件(页面)，所以相对址可能会出错。e

破浪前进·2024-01-11 22:26

HbuilderX使用Uniapp+Vue3安装uview-plus

如果你是vue2版本想使用uniapp去配置uviewui库可以参考之前的文章uView系列——使用教程小程序的第三方ui库推荐较多的还是uview的，看起来比较美观，功能也比较完善，下面将提一下Vue3

Southern Wind·2024-01-11 12:25

微信小程序的map的使用

使用了uview组件。

?Givenchy·2024-01-11 06:15

微信小程序使用uview校验规则没有用的解决办法

最近项目中用到了uview在做表单时用到了校验，发现校验不友好的结果·，具体见文档uview这里有对表单的详解，验证您当前已完成注册和身份认证！！！

?Givenchy·2024-01-11 06:15

uniapp中uview组件库丰富的Table 表格的使用方法

目录#平台差异说明#基本使用#兼容性#API#TableProps#TdProps#ThProps表格组件一般用于展示大量结构化数据的场景#平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用本组件标签类似HTML的table表格，由table、tr、th、td四个组件组成table组件裹在最外层，可以配置一些基础参数tr组件用于显示"行"数据th组件

TechWhiz-晓同·2024-01-10 08:16

uni小程序 uview 1.8.8自定义tabBar

官网;安装|uView-多平台快速开发的UI框架-uni-appUI框架(uviewui.com)先创建一个components文件，里面放置TabBar-TabBar.vue-->exportdefault

蜕变菜鸟·2024-01-10 08:45

uni使用uview自定义导航栏

在page.json设置"pages":[//navbar-自定义导航栏{"path":"/pages/navbar/index","style":{"navigationStyle":"custom",//隐藏系统导航栏"navigationBarTextStyle":"white"//状态栏字体为白色，只能为white-白色，black-黑色二选一}}]data:(){//顶部导航栏navba

蜕变菜鸟·2024-01-10 08:44

uniapp中uview组件库中丰富的LineProgress 线形进度条的使用方法

目录平台差异说明#基本使用#设置进度条动画效果#设置进度条内部显示百分比值#修改进度条的样式#API#Props#Slots平台差异说明AppH5微信小程序支付宝小程序百度小程序头条小程序QQ小程序√√√√√√√#基本使用通过percent设置当前的进度值，该值区间为0-100.通过active-color设置进度条的颜色，也可以直接设置type主题颜色(优先起作用)，使用预置值#设置进度条动画效

TechWhiz-晓同·2024-01-10 08:09

uniapp中picker-view 封装时，分，秒选择组件

前言：因为工作中要用到精确到秒的时间组件，uniapp的组件和uview组件都不太合适，所以自己用picker-view封装一个，写的比较粗糙，有不对的地方请提出来，方便改正，谢谢额。

Lzs、uncle·2024-01-09 23:48

uniapp自定义封装只有时分秒的组件，时分秒范围选择

说实话，uniapp和uview的关于只有时分秒的组件实在是不行。全是日历，但是实际根本就不需要日历这玩意。百度了下，终于看到了一个只有时分秒的组件。

全栈科学家·2024-01-09 23:17

vue3+uniapp+TS+Vite+uView-plus（uniapp-nutui）微信小程序模板搭建

官网下载目录结构：DCloud/uni-preset-vue-码云-开源中国(gitee.com)下载zip压缩包即可目录一.依赖下载二.运行三.vite.config.json文件修改四.uView-plus

程序猿online·2024-01-09 19:15

uview 中u-tabs如何做tab切换？

先看案例如图所示话不多说上代码：1122exportdefault{data(){return{//list:[{name:"额度恢复记录",},{name:"还款记录",},],//默认展开第几项current:0,};},methods:{change(index){this.current=index;//如报错则用this.current=index.index;代替上面这句},},};

王工丶要专注·2024-01-09 10:54

“hasInjectionContext“ is not exported by “node_modules/vue-demi/lib/index.mjs“, imported by “node_mo

使用uniapp开发的微信小程序，技术栈使用的vue3+ts+uview-plus+pinia开发的，环境安装依赖没有问题，但是启动的时候报错："hasInjectionContext"isnotexportedby"node_modules

1024小神·2024-01-08 08:53

likeadmin项目uniapp端u-upload支持图片和视频上传

一、优化vk-uview-ui的upload组件1、修改limitType，支持视频扩展limitType:{type:Array,default(){//支付宝小程序真机选择图片的后缀为"image"

琉璃仙味·2024-01-08 07:43

uniapp动态设置Tabbar

实现原理舍弃uniapp原生的tabbar，使用uView插件下的u-tabbar导航插件来实现。

_Legend_King·2024-01-08 01:58

uview 弹出框放表单验证失效_内容可自定义的弹出框 – CXAlertView

CXAlertView可以添加视图作为主要内容的自定义弹出框。示例在ios5和6中显示ios7样式弹出.不像iOS6以下版本，iOS7无自定义，你无法在其中改变。这个弹出框可以实现在iOS7的弹出框中添加视图。多种弹出文本和按钮标题.全自定义弹出视图，带有通用字体颜色，半径。安装CocoaPodsaddpod‘CXAlertView’如何使用//Create-(id)initWithTitle:(

weixin_39607474·2024-01-07 21:45

uview 弹出框放表单验证失效_基于vue2.0前端组件库element中 el-form表单自定义验证填坑...

我在平时使用过程中，遇到的问题。自定义表单验证出坑:1.validate/resetFields未定义。原因：1：要验证的DOM，还没有加载出来。2：有可能this.$refs[ruleForm].validate()方式不识别。需要使用:this.$refs.ruleForm.validate();这种方式，不是你们想要的结果。解决方法1：要验证的DOM，还没有加载出来。this.ticketD

weixin_39767386·2024-01-07 21:45

uni-app运行环境判断、uView组件库、跨域问题、首页骨架屏

一、uniapp路由uni-app页面路由为框架统一管理，开发者需要在pages.json里配置每个路由页面的路径及页面样式。类似小程序在app.json中配置页面路由一样。所以uni-app的路由用法与VueRouter不同，如仍希望采用VueRouter方式管理路由，可在插件市场搜索Vue-Router。uni-app有两种页面路由跳转方式：使用navigator组件跳转、调用API跳转。语

爱敲代码的狼仔·2024-01-07 20:40

uView Alert 警告提示

警告提示，展现需要关注的信息。#使用场景当某个页面需要向用户显示警告的信息时。非浮层的静态展现形式，始终展现，不会自动消失，用户可以点击关闭。#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过title和description设置组件的标题和描述内容通过type设置主题类型，有primary,success,error,warning,info可选值通过effect设

破浪前进·2024-01-07 20:39

uView Alert 提示

用于页面中展示重要的提示信息。基础用法#Alert组件不属于浮层元素，不会自动消失或关闭。Alert组件提供四种类型，由type属性指定，默认值为info。successalertinfoalertwarningalerterroralert主题#Alert组件提供了两个不同的主题：light和dark。通过设置effect属性来改变主题，默认为light。successalertinfoaler

破浪前进·2024-01-07 20:03

uView ReadMore 展开阅读更多

该组件一般用于内容较长，预先收起一部分，点击展开全部内容的场景。#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过slot传入正文内容exportdefault{data(){return{//这是一段很长的文字，也可能包含有HTML标签等内容content:`山不在高，有仙则名。水不在深，有龙则灵。斯是陋室，惟吾德馨。苔痕上阶绿，草色入帘青。谈笑有鸿儒，往来无白丁。

破浪前进·2024-01-07 20:38

uView LoadMore 加载更多

此组件一般用于标识页面底部加载数据时的状态，共有三种状态：加载前，显示"加载更多"，加入点击可选，是因为数据不够一页时，无法触发页面的onReachBottom生命周期加载中，显示"正在加载..."，2种动画可选加载后，如果还有数据，回到"加载前"状态，否则加载结束，显示"没有更多了"#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过status设置组件的状态，加载前

破浪前进·2024-01-07 20:08

uView CodeInput 验证码输入

该组件一般用于验证用户短信验证码的场景，也可以结合uView的键盘组件使用#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过mode参数模式，可取如下值：box(默认)-输入位置位一个方框

破浪前进·2024-01-07 20:07

uView Tabbar 底部导航栏

优点：此组件提供了自定义tabbar的能力，具有如下特点：图标可以使用字体图标(内置图标和扩展图标)或者图片可以动态切换菜单的数量以及配置切换菜单之前，可以进行回调鉴权可以设置角标或数字化提示有效防止组件区域高度塌陷，无需给父元素额外的内边距或者外边距来避开导航的区域#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用推荐您使用list数组遍历循环，案例使用基础方式构建，请

破浪前进·2024-01-07 20:07

uView Calendar 日历

此组件用于单个选择日期，范围选择日期等，日历被包裹在底部弹起的容器中。注意：此组件与Picker选择器的日期选择模式有一定的重合之处，区别在于本组件为更专业的日期选择场景，能选择日期范围等。另外Picker组件的日期模式可以配置更多的参数，如时、分、秒等，可以根据不同的使用场景进行选择。#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过show绑定一个布尔变量用于打开

破浪前进·2024-01-07 13:57

uView Steps 步骤条

该组件一般用于完成一个任务要分几个步骤，标识目前处于第几步的场景。#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用说明由于安卓nvue下，overflow属性不支持visible值，故此组件暂不支持安卓nvue环境。通过current参数标识目前处于第几步，从0开始copy#错误状态如果设置u-steps-item的error参数为true的话，当前步骤将会为“失败”的

破浪前进·2024-01-07 06:26

uView Tabs 标签

该组件，是一个tabs标签组件，在标签多的时候，可以配置为左右滑动，标签少的时候，可以禁止滑动。该组件的一个特点是配置为滚动模式时，激活的tab会自动移动到组件的中间位置。#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过设置scrollable(默认为true)，配置tabs组件的内容是否可以左右拖动，一般4个标签以下时，无需拖动，设置为false，5个标签以上，建

破浪前进·2024-01-07 06:25

uView Subsection 分段器

该分段器一般用于用户从几个选项中选择某一个的场景#平台差异说明App（vue）App（nvue）H5小程序√√√√#基本使用通过list数组参数传递分段的选项，数组元素可为字符串，或者通过keyName参数传入对象(默认为name)通过current指定初始化时激活的选项exportdefault{data(){return{list:['未付款','待评价','已付款'],//或者如下，也可以配