swiper 高度问题记录

需求：在各个平台实现swiper-item的自动高度，底部的"章节、详情、讨论"采用swiper制作的tab选项，可左右滑动。

思路：
1、css的计算属性calc。给swiper组件设置style="height: calc(100vh - 188upx);"
动态计算屏幕高度减去顶部的高度，在h5中测试没有问题，不知道在其它终端会怎么样，没测试过。

2、高度100%不生效应该是父元素没有高度的问题，在实际测试中顶层view设置为100vh，其它包裹的高度都为100%，则swiper-item的高度也会根据内容高度显示

3、nvue 中样式属性不支持百分比,使用 flex:1
可以给page设置：height: 100%;display: flex;flex-direction: column;再给swiper设置flex：1；然后在盒子里再放一个盒子，同样高度100%；然后给它设置overflow: auto;再在盒子里写内容，就行了。 这个没有测试过

4、https://ask.dcloud.net.cn/question/74184 这个通过计算属性获取屏幕高度

5、https://ask.dcloud.net.cn/article/205 这个通过uniapp的API获取高度

const sysInfo = uni.getSystemInfoSync()  
const w = sysInfo.screenWidth;  
const h = sysInfo.screenHeight;  
console.log(`mode > ${sysInfo.model} , info size > W:${w} H:${h}`)  

const screenW = plus.screen.width;  
const screenH = plus.screen.height;  
console.log(`screen size > W: ${screenW} H:${screenH}`);  

const resolutionW = plus.screen.resolutionWidth;  
const resolutionH = plus.screen.resolutionHeight;  
console.log(`resolution size > W:${resolutionW} H:${resolutionH}`)

6、为了兼容各端，建议字体单位为px、宽高为rpx、布局采用flex。参考官方文档：https://ask.dcloud.net.cn/article/35657