apache / incubator-weex

Apache Weex (Incubating)
https://weex.apache.org
Apache License 2.0
13.74k stars 1.81k forks source link

[Android][Dev-tool] Andorid 7 下 richtext <a> 标签文本在换行处,部分不显示 (weex SDK 0.24.0.1) #3166

Open shushu2013 opened 4 years ago

shushu2013 commented 4 years ago

Describe the bug

richtext 组件内 <a> 标签文本在遇到换行时,部分不显示

To Reproduce

Environment

Expected behavior

<a> 标签文本在遇到换行时,正常显示

http://editor.weex.io/p/shushu2013/richtext-demo/commit/17cf4d09e109318b659d13fa05ed3d67

Screenshots

Screenshot_20200313-104534 Screenshot_20200313-104958 Screenshot_20200313-105044

shushu2013 commented 4 years ago

测试代码:

<template>
  <div class='root'>
        <scroller class='scroller'>
          <richtext class="terms_desc terms_desc_text">
        <span class="terms_desc_text">使用中文测试:</span>
                <a class="terms_desc_text"
                :pseudo-ref="url">
                <span class="terms_desc_text link">{{cn_msg}}</span>
                </a>
        <span class="terms_desc_text">使用中文测试:</span>
                <a class="terms_desc_text"
                :pseudo-ref="url">
                <span class="terms_desc_text link">{{cn_msg}}</span>
              </a>
          </richtext>
          <richtext class="cn_richtext terms_desc terms_desc_text" >
                <span class="terms_desc_text">Using English for test:</span>
                <a class="terms_desc_text"
                :pseudo-ref="url">
                <span class="terms_desc_text link">{{en_msg}}</span>
              </a>
        <span class="terms_desc_text">Using English for test:</span>
                <a class="terms_desc_text"
                :pseudo-ref="url">
                <span class="terms_desc_text link">{{en_msg}}</span>
              </a>
          </richtext>
        </scroller>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        cn_msg: '中文链接带下划线安卓7遇到要断行有问题。',
    en_msg: 'this is a english link with underline android 7 bug.' ,
    url: 'https://baidu.com',
      }
    }
  }
</script>

<style scoped>
    .root {
    background-color: rgba(51, 51, 51, 0.4);
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
  }

  .scroller {
    width: 400px;
    height: 800px;
    padding-top: 108px;
    padding-bottom: 56px;
        border-width: 1px;
        border-color: #ccc;
  }

  .cn_richtext {
    margin-top: 50px;  
  }

  .terms_desc {
    padding-right: 24px;
    padding-left: 40px;
  }

  .terms_desc_text {
    line-height: 48px;
    font-size: 30px;
    font-family: Arial, Helvetica, sans-serif;
    color: #662E93;
  }

  .link {
    text-decoration: underline;
  }

    .span_space {
    color: #ffffff;
  }
</style>