用vue的方法判断是否通过考试---60分通过

这个主要是Vue比较简单的方法去判断你的分数是否通过了考试
这个功能是特别简单。基础的，后续有了更好的方法和更美观的改进，会更新的
实现的效果是

当分数大于等于60的时候

当分数小于60分的时候

他的vue核心代码如下

<template>
  <div id="app">
    <div class="container">
      <p v-if="score!==''">是否通过考试  ：{
    
    {
    
    isPassed()?'恭喜你，通过了考试':'很抱歉，你未能通过考试'}}</p>
      <input type="text" placeholder="请输入你的成绩是……" v-model="score">
    </div>
    </div>
</template>

<script>
export default {
    
    
  name: "app",
  // 数据
  data() {
    
    
    return {
    
    
    score:'',
    };
  },
  methods:{
    
    
    isPassed(){
    
    
     if(this.score){
    
    
       return parseInt(this.score)>=60;
     }
     return false;
    },
  },

};
</script>
<style scoped>
.container{
    
    
  width: 400px;
  height: 300px;
}

 p{
    
    
   width: 400px;
   height: 50px;
  background-color: red;
  color: black;
  font-size: 16px;
}
 input{
    
    
background: #fff;
width: 200px;
height: 30px;
color: blueviolet;
background-color: #fcfcfc;
}
</style>

<style >
#app {
    
    
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
}

#nav {
    
    
  padding: 30px;
}

#nav a {
    
    
  font-weight: bold;
  color: #2c3e50;
}

#nav a.router-link-exact-active {
    
    
  color: #42b983;
}
</style>

留言：初学阶段，记录自己的学习和把自己所学分享一下，有更好的办法。欢迎大家来交流
另外，要是通过的话，背景色是绿色的，没有通过是红色的。这个怎么实现呀？
求指教