字体在iOS14系统显示异常

chenzhongsong commented 3 years ago

.vue文件代码如下


<template>
  <div class="mu-page">
      <div class="border">
        <text class="text">左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题左边标题</text>
      </div>
  </div>
</template>

<script>
export default {
  name: 'demo',
  // 局部注册的组件
  components: {
  },
  // 声明属性
  data() {
    return {};
  },
  // 计算属性
  computed: {},
  // 侦听器
  watch: {},
  /**
   * 组件实例创建完成，属性已绑定，但DOM还未生成，el属性还不存在
   */
  created() {},
  /**
   * 页面渲染完成 vm.$ el 替换，并挂载到实例上去之后调用该钩子
   * 巧用 this.nextTick 解决dom异步渲染未完成情况
   */
  mounted() {},
  /**
   * 由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。
   * 当这个钩子被调用时，组件 DOM 已经更新，所以你现在可以执行依赖于 DOM 的操作。
   */
  updated() {},
  // 函数
  methods: {},
  /**
   * Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，
   * 所有的事件监听器会被移除，所有的子实例也会被销毁。
   */
  destroyed() {}
};
</script>

<style scoped>
.mu-page{
  padding-top:200px;
}
.border {
  border-color: red;
  border-width: 1px;
  padding: 30px;
}
.f1 {
  flex: 1;
}
.text {
  word-wrap: break-word;
  word-break: normal;
  text-overflow: ellipsis;
  lines: 2;
}
</style>

iOS13和iOS14效果对比如下

iOS14最后一行字体被遮挡一部分

Txink commented 3 years ago

https://github.com/apache/incubator-weex/pull/3303

cnryb commented 3 years ago

在 iOS14 设备中，并没有复现这个问题

Acmenbackpack commented 3 years ago

是不是行高不一致导致的...路人

apache / incubator-weex

字体在iOS14系统显示异常 #3302