国产 无码 综合区,色欲AV无码国产永久播放,无码天堂亚洲国产AV,国产日韩欧美女同一区二区

小程序阻止手機(jī)自帶的滑動(dòng)返回退出事件(uni-app,微信小程序,page-container)

這篇具有很好參考價(jià)值的文章主要介紹了小程序阻止手機(jī)自帶的滑動(dòng)返回退出事件(uni-app,微信小程序,page-container)。希望對(duì)大家有所幫助。如果存在錯(cuò)誤或未考慮完全的地方,請(qǐng)大家不吝賜教,您也可以點(diǎn)擊"舉報(bào)違法"按鈕提交疑問(wèn)。

1、使用page-container前先在pages.json配置(重點(diǎn)!)

"usingConponents":{
		"page-container":"/pages/detail/detail"
	},

小程序阻止手機(jī)自帶的滑動(dòng)返回退出事件(uni-app,微信小程序,page-container)

2、在頁(yè)面中配置

<page-container :show="true" :close-on-slideDown="false" :overlay="false" :duration="false"
	style="z-index: 99;width: 100%; overflow: auto;height:100vh"@touchstart.native="onTouchStart"
	@touchmove.native="onTouchEnd">
	
	<view style="z-index: 999;pointer-events:auto"> //頁(yè)面內(nèi)容
	
</page-container>

@touchstart.native和@touchmove.native是用于遮罩層滑動(dòng)的監(jiān)聽(tīng)事件

//觸摸事件(開(kāi)始)
			onTouchStart(e) {
				this.isShow = true
				this.startX = e.touches[0].clientX;
				this.startY = e.touches[0].clientY
			},
			//觸摸事件(結(jié)束)
			onTouchEnd(e) {
				this.endX = e.changedTouches[0].clientX // 觸摸終點(diǎn)
				const subX = this.startX - this.endX // 觸摸滑動(dòng)距離

				if (subX > 50 || subX < -50) {
					//滑動(dòng)一定范圍后操作,彈出彈窗或者提示
				}
			},

關(guān)于page-container 的一些屬性
詳細(xì)可以按照官方文檔:https://developers.weixin.qq.com/miniprogram/dev/component/page-container.html

小程序阻止手機(jī)自帶的滑動(dòng)返回退出事件(uni-app,微信小程序,page-container)文章來(lái)源地址http://www.zghlxwxcb.cn/news/detail-509798.html

到了這里,關(guān)于小程序阻止手機(jī)自帶的滑動(dòng)返回退出事件(uni-app,微信小程序,page-container)的文章就介紹完了。如果您還想了解更多內(nèi)容,請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!

本文來(lái)自互聯(lián)網(wǎng)用戶(hù)投稿,該文觀點(diǎn)僅代表作者本人,不代表本站立場(chǎng)。本站僅提供信息存儲(chǔ)空間服務(wù),不擁有所有權(quán),不承擔(dān)相關(guān)法律責(zé)任。如若轉(zhuǎn)載,請(qǐng)注明出處: 如若內(nèi)容造成侵權(quán)/違法違規(guī)/事實(shí)不符,請(qǐng)點(diǎn)擊違法舉報(bào)進(jìn)行投訴反饋,一經(jīng)查實(shí),立即刪除!

領(lǐng)支付寶紅包贊助服務(wù)器費(fèi)用

相關(guān)文章

  • 【uniapp 中使用uni-popup阻止左滑退出程序】

    在uniapp中,可以使用uni-app插件uni-popup提供的阻止左滑退出程序的功能。具體步驟如下: 安裝uni-popup插件:在HBuilderX編輯器中,打開(kāi)manifest.json文件,找到“dependencies”字段,在其后添加: “uni-popup”: “^1.4.3” 保存并關(guān)閉文件后,HBuilderX會(huì)自動(dòng)安裝插件。 在APP.vue中引入uni

    2024年02月13日
    瀏覽(89)
  • 小程序監(jiān)聽(tīng)返回、阻止頁(yè)面返回、彈框后禁止返回

    小程序監(jiān)聽(tīng)返回、阻止頁(yè)面返回、彈框后禁止返回

    在頁(yè)面內(nèi)彈出半屏的彈窗或在頁(yè)面內(nèi)加載一個(gè)全屏的子頁(yè)面時(shí),用戶(hù)進(jìn)行返回操作會(huì)直接離開(kāi)當(dāng)前頁(yè)面,不符合用戶(hù)預(yù)期,預(yù)期應(yīng)為關(guān)閉當(dāng)前彈出的組件。 為此官方提供“page-container”容器組件,效果類(lèi)似于 popup彈出層,頁(yè)面內(nèi)存在該容器時(shí),當(dāng)用戶(hù)進(jìn)行返回操作,關(guān)閉該容

    2024年02月11日
    瀏覽(17)
  • 微信小程序自定義彈窗阻止滑動(dòng)冒泡catchtouchmove之后彈窗內(nèi)部?jī)?nèi)容無(wú)法滑動(dòng)

    微信小程序自定義彈窗阻止滑動(dòng)冒泡catchtouchmove之后彈窗內(nèi)部?jī)?nèi)容無(wú)法滑動(dòng)

    如圖所示: 自定義彈窗內(nèi)部有帶滾動(dòng)條的盒子區(qū)域 在盒子上滑動(dòng),頁(yè)面如果超出一屏的話(huà),也會(huì)跟著一起上下滾動(dòng) 解決方案:給自定義彈窗 添加 catchtouchmove 事件,阻止冒泡即可 網(wǎng)上不少人說(shuō)什么 catchtouchmove=\\\"true\\\" 這樣,可以沒(méi)問(wèn)題,其實(shí) catchtouchmove=\\\"任何內(nèi)容\\\" 都行,只要

    2024年02月06日
    瀏覽(21)
  • uniapp小程序 用@touchmove.stop.prevent=““阻止滑動(dòng)穿透 但是會(huì)影響彈出層內(nèi)容滑動(dòng)

    uniapp小程序 用@touchmove.stop.prevent=““阻止滑動(dòng)穿透 但是會(huì)影響彈出層內(nèi)容滑動(dòng)

    之前加?scroll-view 也不好使 向上滑動(dòng)也不動(dòng) 后來(lái)加了css? .scroll-view{max-height: 608rpx;?overflow-y: scroll;} ******必加******

    2024年02月11日
    瀏覽(17)
  • 微信小程序阻止事件冒泡

    微信小程序阻止事件冒泡

    微信開(kāi)發(fā)文檔 | 事件詳解、事件綁定 微信開(kāi)發(fā)文檔上提供了不同的事件綁定方法: 1. bindtap:普通事件綁定 2. catchtap:綁定并阻止事件冒泡 3. mut-bind :互斥事件綁定 如下方示例,在使用catchtap綁定事件后,當(dāng)用戶(hù)點(diǎn)擊image時(shí),事件不會(huì)向上冒泡,就不會(huì)觸發(fā)view綁定的點(diǎn)擊事件

    2024年02月09日
    瀏覽(31)
  • 微信小程序阻止小程序返回的兩種方法

    本次項(xiàng)目為uniapp開(kāi)發(fā),原生小程序也可以參考這兩個(gè)方法。 wx.enableAlertBeforeUnload onLoad中聲明 優(yōu)點(diǎn):簡(jiǎn)單方便 缺點(diǎn):無(wú)法自定義樣式、按鈕文字及樣式 page-container 這是一個(gè)類(lèi)似彈框的組件,具體參數(shù)可以去官網(wǎng)查看。 返回操作包括:頂部導(dǎo)航、右滑手勢(shì)、安卓物理返回鍵和

    2024年02月16日
    瀏覽(25)
  • 微信小程序阻止事件冒泡【看這里】

    微信小程序阻止事件冒泡 將子類(lèi)的點(diǎn)擊事件 bindtap 寫(xiě)成 catchtap bindtap :子元素使用bindtap綁定事件后,執(zhí)行的時(shí)候,會(huì)冒泡到父元素(觸發(fā)父元素上綁定的bingtap事件) catchtap :不會(huì)冒泡到父元素上,阻止事件冒泡 uniapp阻止事件冒泡 將子類(lèi)的點(diǎn)擊事件 @click 寫(xiě)成 @click.stop 利用

    2024年02月11日
    瀏覽(30)
  • uniapp微信小程序中阻止事件冒泡

    uniapp微信小程序中阻止事件冒泡

    開(kāi)發(fā)場(chǎng)景:列表中展示地塊的數(shù)據(jù)信息,用戶(hù)可以點(diǎn)擊列表進(jìn)入地塊的詳情界面,也可以點(diǎn)擊列表中的星星按鈕進(jìn)行收藏 遇到的問(wèn)題:每次點(diǎn)擊星星的時(shí)候,都會(huì)觸發(fā)父級(jí)的點(diǎn)擊事件,從而進(jìn)入到詳情界面 原本的代碼: 我原本想到可以使用 @click.stop 用來(lái)阻止時(shí)間冒泡,但是

    2024年02月02日
    瀏覽(150)
  • 在微信小程序中怎樣阻止冒泡事件?

    在微信小程序中怎樣阻止冒泡事件?

    在微信小程序當(dāng)中,當(dāng)兩個(gè)包含的視圖都使用了bindtap函數(shù)來(lái)綁定點(diǎn)擊事件的話(huà),就會(huì)發(fā)生冒泡事件(即點(diǎn)擊內(nèi)部事件時(shí)將同時(shí)觸發(fā)外部事件),如果我們要想阻止冒泡事件的發(fā)生,將被包含在內(nèi)部的bindtap該為catchtap即可,下面請(qǐng)看具體事例。 如下圖所示,紅色框子部分綁定

    2024年02月11日
    瀏覽(33)
  • 微信小程序阻止用戶(hù)返回上一頁(yè),并彈窗給用戶(hù)確定是否要返回上一頁(yè)

    在onload中調(diào)用微信的enableAlertBeforeUnload方法,在首次進(jìn)入會(huì)自動(dòng)監(jiān)聽(tīng)當(dāng)前的頁(yè)面,在返回的時(shí)候會(huì)自動(dòng)彈出彈窗阻止用戶(hù)返回上一頁(yè),點(diǎn)擊確定則返回上一頁(yè),取消則停留在當(dāng)前頁(yè)

    2024年02月07日
    瀏覽(24)

覺(jué)得文章有用就打賞一下文章作者

支付寶掃一掃打賞

博客贊助

微信掃一掃打賞

請(qǐng)作者喝杯咖啡吧~博客贊助

支付寶掃一掃領(lǐng)取紅包,優(yōu)惠每天領(lǐng)

二維碼1

領(lǐng)取紅包

二維碼2

領(lǐng)紅包