background-clip react 数据更新展示不变 坑

[yongheng2016]

• caniuse
• mdn

解决方案

.title{
  position: relative;
}

.title::after {
  content: attr(data-letter);
  background: -webkit-linear-gradient(left, #f2b233, #fff172 55%, #f2b233);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

<div className="title" data-letter={title} />