根据文本动态渲染不同的 背景 颜色 样式

html

<!-- 将请求的数据渲染到页面，根据渲染数据的不同显示不同的背景，颜色，样式-->
 <div
    class="content-list"
    v-for="(item, index) in List"
    :key="index"
      >
<!--当类名有 - 拼接时，要加引号，没有则不用加 -->   
	<div
   	   :class="[
     	{
         	'类名1': item.name === '张三',
      	},
     	{
       	 	类名2: item.name === '李四',
      	},
    ]"
  >
  </div>
</div>

css

.类名1 {
   background-size: cover;
   background-image: url("需要的背景图片");
}
.类名2 {
   background-size: cover;
   background-image: url("需要的背景图片");
}