uniapp怎么使用第三方UI库uview-plus
这篇文章主要介绍了uniapp怎么使用第三方UI库uview-plus的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇uniapp怎么使用第三方UI库uview-plus文章都会有所收获,下面我们一起来看看吧。
一、使用Album相册功能
我用这个功能开发类似动态、朋友圈 那种的列表。
使用起来,目前存在一个问题是,
我想实现的功能是,一排展示3张图片 或 2张图片时, 图片的大小可以自定义。
解决问题方式1:根据图片数量判断,设置multipleSize大小,但排列的方式会变得奇怪。
解决问题方式2:通过rowCount 控制一行展示图片的数量,就不能定义图片大小。
二、 picker 选择器
在使用u-picker时,uniapp app端 数据不显示,后来发现问题,它的数据格式是双层数组
let columns = [ ['中国', '美国', '日本'] ];
三、input输入框 和 Textarea 文本域
在开发使用时,
第一,border="surround" 边框无法显示,
第二,使用下面例子,就会报value等未定义的错误,很奇怪,即使添加value属性也报错
<u--input
placeholder="请输入内容"
border="surround"
clearable
></u--input>
Property "value" was accessed during render but is not defined on instance.
后来我就用html的input输入框自己写样式
四、使用textarea
在开发时,模仿微信公众号文章的回复功能,具体功能描述如下
(1)通过手机软键盘回车,可以自增高
(2)限制增高的最大高度
解决办法如下
<u--textarea
:
@linechange="handleLinechange"
:autoHeight="true"
v-model="replyContent"
>
</u--textarea>
(1)通过autoHeight设置了自增高后,还要通过style来设置height高度,不然自增高和height默认高度会冲突,导致输入完内容后自增高就会变成默认高度
(2)给textarea设置 overflow-y: auto属性,这样限制自增高后,就会产生滚动条
(3)通过linechange事件,来设置自增高的高度 和 限制
let setTextAreaHeight = ref(40); //回复框的高度设置
const handleLinechange = (e)=>{
if(e.detail.height<=80){
setTextAreaHeight.value = e.detail.height*2;
}else{
setTextAreaHeight.value = 160; //高度最终限制在160rpx,超出就会产生滚动条
}
}
相关热词: uniapp使用第三方UIuview-plus
相关内容
这些是最新的
热门排行
- THINKPHP5+GatewayWorker+Workerman 开发在线客服系统
- 在手机浏览器网页中点击链接跳转到微信界面的方法
- 尊云网站目录系统 ThinkPHP5网站分类目录程序 v2.2.221011
- CentOS 7安装shadowsock(一键安装脚本)
- AdminTemplate 基于LayUI 2.4.5实现的网站后台管理模板
- 用NW.js(node-webkit)开发多平台的桌面客户端
- PHP生成随机昵称/用户名
- THINKPHP5网站分类目录程序 尊云网站目录系统
- 织梦(DEDECMS)微信支付接口 微信插件
- 基于LayUI开发的 网站后台管理模板 BeginnerAdmin
- 响应式后台网站模板 - AMA.ADMIN
- layuiAdmin后台管理模板 Iframe版
- LayUI 1.0.9 升级 至 LayUI 2.1.4 方法
- 简洁清爽的会员中心模板
- jQuery幸运大转盘抽奖活动代码