微信小程序 view的高度是被内容撑开的 怎么获取它的高度

这个代码肯定可以查到的，这是官方查DOM属性的API，查到的属性其实也很有限，但是高度是绝对可以查到的，查不到高度的同学可以去看官方文档！

首先给你的xml对象一个id：

<view class="usermotto" style="height:213px;" id='mjltest'/>

然后在js里，用一个SelectorQuery来选择对应id的节点（注意id前面要加一个#号），就可以获取对应节点的属性，包括高度。

//创建节点选择器

var query = wxcreateSelectorQuery();

queryselect('#mjltest')boundingClientRect()

queryexec(function (res) {

//res就是 所有标签为mjltest的元素的信息 的数组

consolelog(res);  

//取高度

consolelog(res[0]height);

})

<image src="{{images}}" bindload="imgLoadFunc"></image>

imgLoadFunc(e){

    thissetData({

      ImgWidth: edetailwidth,

      ImgHeight: edetailheight

    })

  },

因为对小程序父标签和子标签的布局还不是特别了解，不像ios，父标签固定，子标签通过mansory去布局距离父的底部多少即可。小程序的我能想到的就是动态算出每一个标签的高度，然后总高度减掉就是想得到的子标签的高度了。如果有哪位大神可以指导一二，感激不尽~~~

<view id='viewID'>

<view id="scriptID">

        var query = wxcreateSelectorQuery();

        //选择id

        queryselect('#numID')boundingClientRect()

        queryselect('#scriptID')boundingClientRect()

        queryexec(function (res) {

          //res就是 所有标签为mjltest的元素的信息 的数组

          consolelog('所有：',res);

          //取高度

          thatsetData({

            storyHeight:thatdatadetailHeight -(res[0]height+res[1]height)

          })

        });

设置了text-align 和 line-height属性 实现水平和垂直方向居中，在iOS端显示正常居中。但在Android机型特别是小米手机上仅水平居中，垂直方向上会向上偏移。

网上大佬表示：

通过上述，自己尝试了下

PS：后来又尝试使用flex布局 控制居中，发现在iOS和Android上显示正常居中了，不清楚是否是小程序后来实现了兼容。

Android浏览器下line-height垂直居中为什么会偏离？

关于是否使用rpx还是px，首先需要明白两者之间的区别。

rpx：微信小程序中的尺寸单位rpx(responsive pixel):可以根据屏幕宽度进行自适应。规定屏幕宽度为750rpx。微信官方建议视觉稿以iphone6为标准，一般设计师出图为2倍图。

px：iphone6上1px=2rpx

1rpx相当于1个物理像素，何为物理像素，就相当于我们所使用的屏幕的尺寸，只不过换了一种说法叫物理像素，而我们平时css中所用到的px,实际上是数据显示的尺寸，比如文字，、设计样式的盒子的大小1rpx的出现为我们搭起了物理像素与样式像素px之间的桥梁，而且根据屏幕宽度进行自适应

<view class="box">rpx的像素</view>

<view class="bo">px的像素观察</view>

box{  width:300rpx;  height:200rpx;  border:1rpx solid black;  font-size:30rpx;}bo{   width:300px;  height:200px;  border:1px solid black;  font-size:30px;}

结果：

所以，小程序中字体大小用rpx还是px要结合设计师出图的文字大小，建议的话还是以rpx为主。

微信小程序压缩有三种方法，一种是使用官方提供的接口 wxcompressImage(Object object) ；一种是通过压缩的大小，利用canvas重绘来得到压缩；最后一种安装第三方压缩包。

由于第一种方法网上很多人说压缩不明显或者失效，所以选择使用canvas重绘来实现压缩。同时，该种方法可以控制的最大尺寸，保持上传大小尺寸相差不多。在我们的学生节晚会小程序中，屏幕显示会比较美观一致。

1 通过 wxchooseImage 接口选择相机

2 通过 wxgetImageInfo 接口获取信息（长宽，类型）

3 计算压缩比例和最终的长宽

5 通过 wxcanvasToTempFilePath 接口将画布内容导出为并获取路径

wxml 文件

在文件末尾插入 canvas 组件，通过设置left和top值确保不会显示在可视范围内。

一定要设置 canvas-id，这是canvas绘图和导出必备的属性。

js 文件

设置与页面绑定的数据：canvas的大小，也是压缩后的大小

1 将画布内容导出为时，指定destWidth和destHeight为压缩后的大小。这里遇到过玄学bug，不指定的话，有时候不会压缩到规定的大小。

日常记录学习~~

参数参考官方文档： >

使用竖向滚动时，需要给一个固定高度，通过WXSS设置height，否则无法滚动。

当滚动到顶部时会触发事件（具体可留意GIF输出）

当滚动到底部时会触发事件（具体可留意GIF输出）

以上就是关于微信小程序 view的高度是被内容撑开的 怎么获取它的高度全部的内容，包括:微信小程序 view的高度是被内容撑开的 怎么获取它的高度、微信小程序 获取照片宽高、微信小程序-动态获取view高度等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！