目錄
問題集合
頁面彈出背景滾動
在頁面中彈窗彈出，對彈窗內(nèi)容進行滑動以后，背景內(nèi)容也進行滾動。
解決方案1、對彈出的頁面設(shè)定屬性 catchtouchmove="move
<div
catchtouchmove="move"
class="c-modal-example"
v-if="modal.visable"
@click="close">
<a @click="close"></a>
<div class="content">
<img
src="/static/WechatIMG8076.jpeg"
mode="aspectFit"
:class="{
'example__img__is-iphonex': device.isMiniProgramIsIPhoneX
}">
</div>
</div>
解決方案2、對背景頁面內(nèi)容固定 :scroll-y="false"
<scroll-view
:scroll-y="false"
@scrolltolower="getProducts"
:style="{ height: windowHeight + 'px'}">
<div class="tip" v-if="tipVisable">
<div class="tip__icon">
<img src="/static/tip-ted.jpg">
</div>
<div class="tip__cell">
<a @click="tipVisable = !tipVisable"></a>
<h1>Hi Devin</h1>
<p>Movin Poster is a tool to create your own item poster to share in your Wechat moments or on any social platforms.</p>
<span @click="showModalExample">See an example</span>
</div>
</div>
<c-btn
type="primary"
@click="createPoster"
suspend>
Create poster
</c-btn>
<c-modal-example />
</scroll-view>
form bindsubmit="formSubmit"無效
在mpvue中實現(xiàn)消息模版推送，發(fā)現(xiàn)總是提示 Do not have formSubmit handler in current page ，是因為在mpvue中綁定from提交事件的寫法需要變成：@submit="postFormId"
> 解決方案1(demo)
<template>
<div class="c-product-cards">
<a v-if="items" v-for="(item, index) in items" :key="index">
<form @submit="postFormId" report-submit="true">
<button formType="submit" @click="goToProductDetail(item)"></button>
<figure>
<img :src="item.product_main_image_url" mode="aspectFill">
</figure>
</form>
</a>
</div>
</template>
<script>
import formApi from '@/utils/api/form'
export default {
props: {
items: {
type: Array,
default: () => []
}
},
methods: {
postFormId (e) {
const data = {
form_id: e.target.formId
}
formApi.postWXFormId(data)
},
goToProductDetail (item) {
/*
view = groupon 說明視角是要拼團
view = normal 說明正常顯示拼團和立即購買
*/
wx.navigateTo({
url: `/pages/product?id=${item.product_id}&view=normal`
})
}
}
}
</script>
