记录一下【微信小程序skyline模式的一些坑】-Toy模板网

这篇具有很好参考价值的文章主要介绍了记录一下【微信小程序skyline模式的一些坑】。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

引言

最近在用这个skyline渲染模式开发页面，记录一下遇到的一些坑，总结一下使用体验：~~快跑！run！~~

总结我遇到的不能接受的地方

无法使用css变量 ，基于unocss或tailwind原子化css，需要对css变量做额外的处理，有点难受了；
wxss使用import导入公共wxss，不生效，难受加剧;
最新的nighly版的微信开发者工具，flex布局方向默认是 columns，而移动端是 row，这个是个大坑！！！需要额外的给.flex class增加flex-direction:row 特别注意！; 感到疼痛
skyline模式所有的元素布局默认不使用盒模型，偏偏开发者工具又是默认的盒模型显示，在你以为一切都没问题的时候，真正上手机调试就知道了，差点两眼一黑，直接昏过去~ 解决很简单，习惯了盒模型的，只需要给每个 view 添加 box-sizing:border-box；所有view元素默认使用盒模型； 感到剧烈疼痛
开发者工具特别卡，元素审查工具基本用不了，特别容易崩溃，这个是老传统了，不能怪skyline，它只是加剧了反应
后面的，待我遇到了再继续补充，（让老夫瞧瞧他那手势系统和动画再来吐槽）

这些坑新来的注意下，基本页面布局问题不大了。
最新更新
我CTNN的skyline
一堆的坑，微信做不来就不要做好嘛，残次品就急忙放出来给人用！！！
7.最重要的一个坑，skyline模式不支持真机调试，请使用预览模式！！！（为了方便调试，我一般用真机，调着调着就发现，这玩意兼容性也太差了，vant1.x版本的组件在这个模式是有兼容问题的，pop底部弹窗组件就有问题，这个组件请使用vant 0.x版本的
8.textarea在这个模式下，直接使用没啥问题，如果是组件内的textarea，bindinput,bindkeyboardHeightChange,bindconfirm等等这些事件是失效的，CTNN的skyline，做不好就不要做！（如果实在想使用组件的方式，就不要用wx:if来控制显隐；可以试着给这个组件position:absolute,bottom:-100%,或者z-index:-1，真正要显示的时候，就bottom:0，或者z-index:999;）
9.这个模式组件最外层默认套了一层view,如果不给这个view写高度，那么这玩意默认就不显示，这点格外注意，都tm什么年代了，还在写fragment，这玩意就是一坨垃圾。