为什么不及格不消失呢

用vue的v-if实现成绩分类等级，小于六十为不及格，大于六十到八十的为及格

• 调下顺序试试看
  

  

【以下回答由 GPT 生成】

问题分析：

根据提供的代码，需要根据输入的成绩来判断是否及格，并将不及格的成绩隐藏起来。但是无论输入什么成绩，不及格的内容始终显示出来。

问题解决方案：

查看代码发现，在<script setup>部分的const score = ref(90);中初始化的成绩是90分，因此不管输入什么成绩，都不符合小于60分的条件，所以不及格的内容一直显示出来。

要解决这个问题，可以将成绩初始化为一个初始值，然后通过输入框来动态更新成绩。

修改后的代码如下所示：

<template>
  <div>
    <input type="text" v-model.number="score" />
    <p v-if="score < 60">不及格</p>
    <p v-if="60 <= score && score <= 80">及格</p>
  </div>
</template>

<script setup>
import { ref } from 'vue';

const score = ref(); // 将初始值设为null或者undefined，或者其他合适的默认值
</script>

这样修改后，输入框中的成绩将会被实时更新，根据输入的成绩来判断是否及格，并将不及格的内容隐藏起来。

请注意：以上解决方案仅针对提供的代码进行修正，如果还有其他代码或逻辑问题，请提供更多细节以便进一步分析和解决。

【相关推荐】

• 你可以参考下这个问题的回答, 看看是否对你有帮助, 链接: https://ask.csdn.net/questions/7666950
• 这篇博客也不错, 你可以看下Vue中判断语句和循环语句的基础用法 v-if和v-for的注意事项
• 您还可以看一下 马金聚老师的Vue全家桶技术+商城项目实战+源码解析课程中的 Vue指令之事件修饰符小节, 巩固相关知识点
  
• 除此之外, 这篇博客: 关于前端vue开发的面试题中的 20.为什么避免v-if 和v-for 共用 部分也许能够解决你的问题。