VUE 动态修改颜色值_vue 动态color

<div class="deFenlv" v-bind:style="'color:' + deFenLvColor" >
 	班级得分率{{ deFenLv }}%
</div>

在computed 函数块中添加自定义函数，当内部变量deFenLv变动时，自动变动颜色值

 <script>
 	export default {
 		name: 'PaperIteam',
 		props: {
 			soft: String,
 			data2: {},
 		},
 		data() {
 			return {
 				deFenLv: 74,
				color1: "#7ccd7d",
 
 				// visible: true,
 				// 	content: '测试内容',
 			}
 		},
 
 		// filters: {
 
 		//   contentFormat(content)
 		//   {
 		//       if(content.length > 56)
 		//       {
 		//           return content.substring(0, 56) + '...';
 		//       }
 		//       else return content;
 		//   }
 		// },
 
 		mounted() {},
 		created() {},
	    computed: {
			deFenLvColor()
			{
				if(this.deFenLv > 80) return "#7ccd7d";
				else if(this.deFenLv > 60) return "#e65a56"; 
				else return "#e22121"; 
			}
	    },
 		methods: {
			
		}
 
 	}
 </script>