::after ::before 伪元素动态改变content内容

很多时候需要给元素加上个小标签，这时候伪元素经常会被用到，但是呢，有些时候小标签的内容是不固定的，比如好几个菜品，每个菜品都有不同的点赞数。所以如果还用伪元素的话，设置content内容动态化就是关键。

办法

1. 动态渲染元素时，指定自定义属性

   // vue
   <li v-for="(e,i) in list" :data-star="e.star" style="color: #fff"></li>
   

2. 对应的css样式

   li::after{
       content: attr(data-star) /* 伪元素动态获取内容 */
       /* 其他的此处省略 */
   }
   
   /* 当然 attr(style) 同样可以获取style的内容，并不严格要求一定用自定义属性 */