收藏
回答

请问如何实现页面多个关键字高亮呢?类似图中这样的

最后一次编辑于  2021-11-04
回答关注问题邀请回答
收藏

7 个回答

  • 青团社
    青团社
    2021-11-04

    是这样么????

    <text class="search-title {{你的文字 === 输入的文字 ? 'searchHigh(高亮的样式)' : '' }}" a:for="{{item.newTitleList}}" a:key="*this">{{item}}</text>
          </view>
    this.getHighLightStrArray('你的文字', '输入的文字')
    
    // 将字符串匹配后进行分割
    getHighLightStrArray(str, key) {
      return str.replace(new RegExp(`${key}`, 'g'), `%%${key}%%`).split('%%')
    },
    
    2021-11-04
    有用 2
    回复 3
    • Mi
      Mi
      发表于小程序端
      2021-11-05

      牛啊 一直不知道怎样动态生成正则匹配规则。感谢

      2021-11-05
      回复
    • 青团社
      青团社
      2021-11-05回复Mi
      这样是根据输入的文字把一整段文字分割成数组。通过多个text匹配渲染。
      2021-11-05
      回复
    • 青团社
      青团社
      2021-11-05回复Mi
      代码我贴的支付宝小程序的,改为wx:就好了。。
      2021-11-05
      回复
  • Xavier
    Xavier
    2021-11-04
    <view>
      <text class="white">(5 items)</text> Gain <text class="yellow">Major Gallop</text> and <text class="yellow">Major Expedition</text> at all times,
    </view>
    

    ——我是一条小尾巴🗯️

    2021-11-04
    有用 1
    回复
  • 老张
    老张
    2021-11-04

    <text>

    2021-11-04
    有用 1
    回复 1
    • Mi
      Mi
      发表于小程序端
      2021-11-05

      不好意思我没表达清楚,文本数据是动态改变的,该如何实现呢

      2021-11-05
      回复
  • 谋谋谋
    谋谋谋
    2021-11-04

    css 了解一下

    2021-11-04
    有用 1
    回复
  • dreamhunter
    dreamhunter
    2021-11-04

    <a><span style="color:#cc0000;font-weight: normal;">1</span>.doc</a>

    2021-11-04
    有用
    回复
  • 微喵网络
    微喵网络
    2021-11-04
    color: yellow;
    
    2021-11-04
    有用
    回复
  • 国安
    国安
    2021-11-04

    text+css

    2021-11-04
    有用
    回复
登录 后发表内容