提交 8b26e9bb 编写于 作者: DCloud_JSON's avatar DCloud_JSON

更新 示例项目 pull-zoom-image 限制最大下拉距离

上级 ceed2f08
...@@ -3,8 +3,8 @@ ...@@ -3,8 +3,8 @@
<image class="back-img" src="/static/template/scroll-fold-nav/back.png" mode="widthFix"></image> <image class="back-img" src="/static/template/scroll-fold-nav/back.png" mode="widthFix"></image>
</view> </view>
<scroll-view :scroll-y="true" style="flex:1;" :refresher-enabled="true" <scroll-view :scroll-y="true" style="flex:1;" :refresher-enabled="true"
:refresher-triggered="refresherTriggered" refresher-default-style="none" @refresherpulling="onRefresherpulling" refresher-default-style="none" @refresherpulling="onRefresherpulling"
@refresherrefresh="onRefresherrefresh" :refresher-threshold="300"> :refresher-threshold="300" :refresher-max-drag-distance="299">
<view class="head-img-box"> <view class="head-img-box">
<image class="head-img-2" ref="head-img-2" src="../../../static/template/pull-zoom-image/head-img.jpg" mode="scaleToFill"></image> <image class="head-img-2" ref="head-img-2" src="../../../static/template/pull-zoom-image/head-img.jpg" mode="scaleToFill"></image>
...@@ -36,8 +36,7 @@ ...@@ -36,8 +36,7 @@
export default { export default {
data() { data() {
return { return {
$INodeMap: new Map<string, INode>(), $INodeMap: new Map<string, INode>()
refresherTriggered: false,
} }
}, },
methods: { methods: {
...@@ -47,24 +46,13 @@ ...@@ -47,24 +46,13 @@
this.setINodeStyle("head-img-1", 'transform', `scale(${pullingDistance / 200 + 1})`) this.setINodeStyle("head-img-1", 'transform', `scale(${pullingDistance / 200 + 1})`)
this.setINodeStyle("head-img-2", 'transform', `scale(${pullingDistance / 200 + 1})`) this.setINodeStyle("head-img-2", 'transform', `scale(${pullingDistance / 200 + 1})`)
}, },
onRefresherrefresh() { // 工具方法,用于快速设置 INode 的 style
this.refresherTriggered = true setINodeStyle(refName : string, propertyName : string, propertyStyle : any) : void {
//拖动结束
setTimeout(() => {
this.refresherTriggered = false
}, 0)
},
getINode(refName : string) : INode {
let iNode : INode | null = this.$INodeMap.get(refName) let iNode : INode | null = this.$INodeMap.get(refName)
if (iNode == null) { if (iNode == null) {
iNode = this.$refs.get(refName) as INode; iNode = this.$refs.get(refName) as INode;
this.$INodeMap.set(refName, iNode) this.$INodeMap.set(refName, iNode)
} }
return iNode
},
// 工具方法,用于快速设置 INode 的 style
setINodeStyle(refName : string, propertyName : string, propertyStyle : any) : void {
let iNode = this.getINode(refName)
iNode.style.setProperty(propertyName, propertyStyle); iNode.style.setProperty(propertyName, propertyStyle);
}, },
back() { back() {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册