打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
vue中的if判断和for循环语句
userphoto

2022.07.01 浙江

关注

if语句


 <div class="vm">
	   <div v-if="type==='A'">
            A
        </div>
        
        <div v-else-if="type==='B'">
            B
        </div>
        
        <div v-else-if="type==='C'">
            C
        </div>
        
        <div v-else>
            error 
        </div>
</div>
script type="text/javascript">
        var vm = new Vue({
            el:'.vm',
            data:{          
                type:'', //为空时页面显示error
                type:'A', //为空时页面显示A
                type:'B', //为空时页面显示B
                type:'C', //为空时页面显示C
                
        })
</script>

for语句


<div class="vm">
		//for循环数组
		 <ul>
            <li v-for='item,index in items'>
                {{index}}===={{item.msg}}
            </li>
        </ul>

		//for循环对象
        <ul>
            <li v-for='value,key in object'>
                {{key}}===={{value}}
            </li>
        </ul>
</div>
<script type="text/javascript">
        var vm = new Vue({
            el:'.vm',
            data:{
                items:[
                    {msg:'aaaa'},
                    {msg:'bbbb'},
                ],
                object:{
                    name:'zhangsan',
                    age:'30',
                }
            },      
        })
</script>

页面效果:

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
Vue2递归组件实现树形菜单
Vue3 循环语句 | 菜鸟教程
元素的克隆clone
vue基础学习总结一
vue.js常用语法
Vue基础知识总结(绝对经典)
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服