weex 页面真机显示空白

新手上路,请多包涵

问题描述

使用weex创建了工程,然后修改了页面,页面有三个div组成,npm start在浏览器中能显示出内容,但是在iOS模拟器和真机上显示空白

问题出现的环境背景及自己尝试过哪些方法

环境:

  • iOS 12.0
  • weex 0.18.0

相关代码

vue文件内容如下:

<template>
  <div class="login">
    <div class="images">1
    </div>
    <div class="centerPart">2
    </div>
    <div class="agree">3</div>
  </div>
</template>

<style scoped>
.login {
  display: flex;
  flex-direction: column;
  background-color: red;
}
.login :first-child{
  height: 250px;
}
.login :last-child{
  height: 200px;
}
.images {
  flex: 0 0 auto;
  background-color: aqua;
}
.centerPart{
  flex: 1 0 auto;
  background-color: yellow;
}
.agree {
  flex: 0 0 auto;
  background-color: coral;
}
</style>

<script>

</script>

你期待的结果是什么?实际看到的错误信息又是什么?

在浏览器中显示如下并且是我预想的样子:
图片描述

但是在iOS模拟器和真机上显示空白:
图片描述

尝试的方法

  1. 试着将login div中的子元素都删除,可以显示红色;
  2. 保留子元素,试着设置login 的高度,但还是白色;

怀疑是flex导致的,但是不知道怎么解决。

阅读 3.3k
1 个回答
✓ 已被采纳新手上路,请多包涵

估计是缓存之类的影响。
将platform下的内容都删除,然后重新生成 : weex platform add ios
然后,模拟器上可以显示了。
另外注意flex的写法: flex: number;

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题