收藏
PHPz批改状态：合格
老师批语：
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>Vue列表渲染与条件渲染</title></head><script src="https://unpkg.com/vue@3/dist/vue.global.js"></script><body><div class="app"><span>列表渲染</span><li v-for="(city,key) of cities" :key="key">{{key}} : {{city}}</li></div><div class="app2"><span>条件渲染</span><p v-if="point < 1000">{{grade[4]}}</p><p v-if="point >= 1000 && point < 2000">{{grade[0]}}</p><p v-else-if="point >= 2000 && point < 3000">{{grade[1]}}</p><p v-else-if="point >= 3000 && point < 4000">{{grade[2]}}</p><p v-else-if="point >= 4000">{{grade[3]}}</p></div></body><script>// 列表渲染Vue.createApp({data() {return {// arraycities: ['合肥', '上海', '南京'],}}}).mount('.app');// 条件渲染Vue.createApp({data() {return {// 会员Plus级别grade: ['纸片会员', '木头会员', '铁皮会员', '金牌会员', '非会员'],// 积分point: 500,}}}).mount('.app2');</script></html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
