【uniapp常用】

1.隐藏顶部标题栏

需要在 page的style里写

"app-plus":{
		"titleNView":false
}

2.列表底部边框设置

border-bottom: 1px solid rgba(190, 191, 194, .5);

3.绝对位置

.warp {
		display: flex;
		position: relative;
	}
	.addStyle {
		display: flex;
		position: fixed;
		bottom: 300rpx;
		left: 350rpx;
		z-index: 999;
	}

4.上拉加载和下拉刷新

Page里加上 “enablePullDownRefresh”: true,

this.totalPage = res._DATA_.count / 20;
if (this.currentPage == 1) {
	this.dataList = res._DATA_.data;
} else {
	this.dataList = this.dataList.concat(res._DATA_.data);
}

		onPullDownRefresh() {
			this.loadListData();
			uni.stopPullDownRefresh();
		},

		onReachBottom() {
			this.currentPage++;
			if (this.currentPage > this.totalPage) {
				uni.showToast({
					title: '暂无更多数据'
				})
			} else {
				this.loadListData();
			}
		}

5.左滑删除和页面弹框

 <uni-swipe-action>
	<uni-swipe-action-item :right-options="options1" @click="showModal(i.ID)">
			<view class="lineWarp"></view>
	</uni-swipe-action-item>
</uni-swipe-action>
<u-modal :show="showMadal" @confirm="confirm()" @cancel="cancle()" content="确定删除吗?" :closeOnClickOverlay="true"
			:showCancelButton="true" width="300rpx"></u-modal>

6.数据转换

// 将数据转化成uni-form-item可以用的格式
			getList(res) {
				var array = [];
				res.map((item) => {
					var list = {
						"name": "",
						"code": ""
					};
					list.name = item.ITEM_NAME;
					list.code = item.ITEM_CODE;
					array.push(list)
				})
				return array
			},
			// 将数据转化成u-upload可以用的格式
			getImgList(res) {
				var array = [];
				res.map((item) => {
					var list = {
						"url": "",
					};
					list.url = item.path_YZ;
					array.push(list)
				})
				return array
			}

7.文字换行

		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
		text-overflow: ellipsis;

8.页面view换行

需要在 page的style里写

display: flex;
		flex-wrap: wrap;

9.多级页面返回

			clickBack() {
				const _pages = getCurrentPages()
				if (_pages.length < 2) {
					uni.webView.postMessage({
						data: {
							type: 'goBack'
						},
					});
				} else {
					uni.navigateBack()
				}
			},

10.页面传值和跳转

let data = encodeURIComponent(JSON.stringify(this.dataProps))
				uni.navigateTo({
					url: './search?data=' + data
				})
				
this.dataProps = JSON.parse(option.data);
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值