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怎么使用第三方UI庫uview-plus”這篇文章的內容就介紹到這里，感謝各位的閱讀！相信大家對“uniapp怎么使用第三方UI庫uview-plus”知識都有一定的了解，大家如果還想學習更多知識，歡迎關注億速云行業資訊頻道。