我是靠谱客的博主 沉静缘分,最近开发中收集的这篇文章主要介绍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中的if判断和for循环语句所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

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

评论列表共有 0 条评论

立即
投稿
返回
顶部