vue根据数据判断显示

Question

vue根据数据判断显示和隐藏。
tableData第一个没有数据，view怎么判断第一个为空时view不显示？
同样第三个iphone为空，那手机就不显示，应该怎么判断？

<template>
    <view>
        <view v-for="(item,index) in tableData" :key="item">
            <span>名称：{{item.name}}</span>
            <span>手机：{{item.iphone}}</span>
                        <image src="../../static/tab/my.png"></image>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                tableData:[
                    {},
                    {
                        name:"abc",
                        iphone : "12"
                    },
                    {
                        name:"abc",
                        iphone : ""
                    }
                ]
            }; 
        },
    };
</script>

<style>
</style>

Answer 1

<template>
    <view>
        <view v-for="(item,index) in tableData" :key="item">
             <view v-if="JSON.stringify(item) != '{}'">
              <span>名称：{{item.name}}</span>
              <span v-if="item.iphone">手机：{{item.iphone}}</span>
                        <image src="../../static/tab/my.png"></image>
            </view>
        </view>
    </view>
</template>
 
<script>
    export default {
        data() {
            return {
                tableData:[
                    {},
                    {
                        name:"abc",
                        iphone : "12"
                    },
                    {
                        name:"abc",
                        iphone : ""
                    }
                ]
            }; 
        },
    };
</script>
 
<style>
</style>