我是靠谱客的博主 沉静缘分,这篇文章主要介绍vue中的if判断和for循环语句,现在分享给大家,希望可以做个参考。

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>

页面效果:

在这里插入图片描述

最后

以上就是沉静缘分最近收集整理的关于vue中的if判断和for循环语句的全部内容,更多相关vue中内容请搜索靠谱客的其他文章。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(51)

评论列表共有 0 条评论

立即
投稿
返回
顶部