map组件和cover-view组件使用过度效果不起作用
发布于 7 年前 作者 juan67 1637 次浏览 来自 问答

map组件和cover-view在我控制他们的高时在开发者工具上没问题,但是在手机上没效果

<!–component/phase/index.wxml–>

<map bindtap=‘contentShowTap’ class=‘map {{isShowContent?“show_map”:“hide_map”}}’></map>  

<!-- <view bindtap=‘contentShowTap’ bindtouchstart=‘contentShowStart’ bindtouchmove=“contentShowMove” bindtouchend=‘contentShowEnd’ class=‘content {{isShowContent?“show_content”:“hide_content”}}’>

 <view style=‘height:100rpx’>1</view>

 <view style=‘height:100rpx’>1</view>

 <view style=‘height:100rpx’>1</view>

 <view style=‘height:100rpx’>1</view>

</view>   -->

wxml

<cover-view bindtap=‘contentShowTap’ bindtouchstart=‘contentShowStart’ bindtouchmove=“contentShowMove” bindtouchend=‘contentShowEnd’ class=‘content {{isShowContent?“show_content”:“hide_content”}}’>

<cover-view style=‘height:100rpx’>1</cover-view>

<cover-view style=‘height:100rpx’>1</cover-view>

<cover-view style=‘height:100rpx’>1</cover-view>

<cover-view style=‘height:100rpx’>1</cover-view>

</cover-view>  

js

data: {

isShowContent:false,

isMove:false,

},

contentShowTap(){

console.log(1)

this.setData({

isShowContent: !this.data.isShowContent

})

},

contentShowStart(){

console.log(“点击开始”)

},

contentShowMove(){

this.setData({

isMove:true

})

},

contentShowEnd(){

if (this.data.isMove){

this.setData({

isShowContent: !this.data.isShowContent

})

}

}

wxss

.map{

transition: all .7s;

width: 100%;

}

.hide_map{

height: 73.3vh;

}

.show_map{

height: calc(73.3vh - (754rpx - 26.7vh));

}

.content{

position: fixed;

bottom: 0;

left: 0;

width: 100%;

background: white;

transition: all .7s;

overflow: hidden;

}

.hide_content{

height: 26.7vh;

}

.show_content{

height: 754rpx;

}

框架中提到map组件的限制

但是没说过度不可以

cover-view

组件中提到

没说过度不可以

请问我应该怎么去写这个过度

4 回复

cover-view的好多坑 布局的时候会和手机上显示的不一样  比如cover-view不支持单边border 我用一个cover-view标签设高度为1rpx 宽度为100% 设个背景颜色  当作边框的效果 但是这个效果在开发者攻击中有的呈现有的不呈现 但是在ios中却全部显示 这个应该怎么解决

就是 bindtouchmove 和 bindtouchend 事件不会触发

cover-view的touch事件还不支持,下个版本即将支持

我刚看到第四条 我试一下

回到顶部