ios - Weex：网页在网页上显示正确，但在 iOS 设备上显示不正确

Question

我用weex启动一个项目，login.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>

当我运行时npm start，它会在浏览器中显示我想要的内容：

但是，当我运行时weex run ios，模拟器显示一个空白页：

我也在设备中尝试过，它也显示一个空白页面。

所以只是想知道为什么它在模拟器中是空白的，我怎样才能找出原因？

Answer 1

Weex 还不支持完整的flex简写语法。您只能指定flex-grow零件。

在您的示例中，使用flex: 1;in.centerPart并且它应该调整其高度。

Answer 2

也许你可以尝试在你的风格中添加这个

width: 750px;
flex: 1;

750px 是所有设备的宽度，weex 使用的 flex 布局默认