css文字渐变，vue更新失效

css设置文字渐变的方式：

<span class="span_class"></span>

.span_class{
  background-image: -webkit-linear-gradient(top, #c4e5fe, #ffffff);
  -webkit-background-clip: text;
  color: transparent;
}

问题：span设置文字渐变效果后，更新data里的数据值vue视图不更新。

解决方式：使用html赋值并重新设置样式。

$(".span_class").html("123");
$(".span_class").css("backgroundImage","-webkit-linear-gradient(top, #c4e5fe, #ffffff)");
$(".span_class").css("webkitBackgroundClip","text");
$(".span_class").css("color","transparent");