7.vue指令3
内容v-if, v-else,v-else-if步骤添加数据添加标签添加指令p v-ifnumber1性别男/p p v-else性别女/p注意else需要紧挨if使用不能单独存在显示内容在p/p中间v-else-if用于复杂场景注意两个数据之间要用,(英两个标签不能用同一个因果链两个if总结两个数据不能用同一个因果链接代码!DOCTYPE html html langen head meta charsetUTF-8 meta http-equivX-UA-Compatible contentIEedge meta nameviewport contentwidthdevice-width, initial-scale1.0 titleDocument/title /head body !-- 创建 -- div idapp p v-ifnumber1性别男/p p v-else性别女/p p v-ifscore80成绩评定A: 奖励电脑一台/p p v-else-ifscore60成绩评定B: 奖励周末郊游/p p v-else-ifscore20成绩评定C: 奖励零食礼包/p /div script srchttps://cdn.jsdelivr.net/npm/vue2.7.16/dist/vue.js/script script const app new Vue({ el:#app, data:{ number:0, score:62 } }) /script /body /html