使用v-if判断条件赋值文字并给文字添加颜色

最新推荐文章于 2024-04-19 15:18:46 发布

#神说要有光#

最新推荐文章于 2024-04-19 15:18:46 发布

阅读量2.6k

点赞数 1

文章标签：前端 js es6

本文链接：https://blog.csdn.net/weixin_57988035/article/details/121507924

版权

本文介绍如何在Vue应用中利用v-if指令进行条件判断，并根据判断结果动态给文字设置不同颜色，结合ES6语法提高代码效率。

摘要由CSDN通过智能技术生成

<template>

<div class="textResults" v-if="copyRating == '文案质量偏低'" style="color: #91C7AE">{
 {copyRating}}</div>
<div class="textResults" v-else-if="copyRating == '文案质量一般'" style="color: #63869E">{
 {copyRating}}</div>
<div class="textResults" v-else-if="copyRating == '文案质量良好'" style="color: #63869E">{
 {copyRating}}</div>
<div class="textResults" v-else-if="copyRating == '文案质量极佳'" style="color: #C23531">{
 {copyRating}}</div>