uniapp多端开发渲染异常

使用uniapp进行多端开发时,从后端获取数据进行渲染,只有H5端可以正常渲染显示,微信小程序和手机端可以获取数据,但不会渲染显示,运行时也没有错误提示信息
问题相关代码,请勿粘贴截图
<!-- ------- ArticleList ------- -->
<template>
    <swiper class="swiper-container" :current="activeIndex" @change="changeActiveIndex">
        <swiper-item v-for="(item, index) in labelList" :key="item._id">
            <view class="swiper-item">
                <ListItem :loadData="loadData[index]" :articleList="articleData[index]" @loadMore="loadMoreData"></ListItem>
            </view>
        </swiper-item>
    </swiper>
</template>

<script>
    export default {
        name:"ArticleList",
        props: {
            labelList: Array,
            activeIndex: Number
        },
        created() {
            // this._getArticleList()
        },
        watch: {
            labelList(newValue, oldValue) {
                this._getArticleList(this.activeIndex)
            }
        },
        data() {
            return {
                articleData: {},
                loadData: {},
                page: 1,
                pageSize: 7
            };
        },
        methods: {
            changeActiveIndex(e) {
                const {current} = e.detail
                this.$emit('changeActiveIndex', current)
                if (!this.articleData[current] || this.articleData[current].length === 0) {
                    this._getArticleList(current)
                }
            },
            /* 进行数据的请求获取 */
            async _getArticleList(currentIndex) {
                // 指定每一个分类里面的页数信息
                if (!this.loadData[currentIndex]) {
                    this.loadData[currentIndex] = {
                        page: 1,
                        loading: 'loading',
                        total: 0
                    }
                }
                
                const {articleList, total} = await this.$http.get_article_list({
                    classify: this.labelList[currentIndex].name,
                    page: this.loadData[currentIndex].page,
                    pageSize: this.pageSize
                })
                
                let oldList = this.articleData[currentIndex] || []     // 追加每一次的请求数据结果
                oldList.push(...articleList)
                this.loadData[currentIndex].total = total
                this.$set(this.articleData, currentIndex, oldList)
            },
            /* 到底加载更多内容事件 */
            loadMoreData() {
                if (this.loadData[this.activeIndex].total === this.articleData[this.activeIndex].length) {
                    this.loadData[this.activeIndex] = {
                        ...this.loadData[this.activeIndex],
                        ...{loading: 'noMore', page: this.loadData[this.activeIndex].page}
                    }
                    this.$forceUpdate()
                    return
                }
                this.loadData[this.activeIndex].page += 1
                this._getArticleList(this.activeIndex)
            }
        }
    }
</script>

<!-- ------- ListItem ------- -->
<template>
    <view class="list-scroll-container">
        <scroll-view scroll-y="true" class="list-scroll" @scrolltolower="loadMore">
            <view>
                <ListCard v-for="(item) in articleList" :key="item._id" :item="item"></ListCard>
            </view>
            <uLi-load-more
                v-if="articleList.length === 0 || articleList.length > 7"
                :status="loadData.loading || 'loading'"
                >
            </uLi-load-more>
        </scroll-view>
    </view>
</template>

<script>
    export default {
        name:"ListItem",
        props: {
            articleList: {
                type: Array,
                default() {
                    return []
                }
            }, 
            loadData: {
                type: Object,
                default() {
                    return {
                        loading: 'loading'
                    }
                }
            }
        },
        data() {
            return {
                
            };
        },
        methods: {
            loadMore() {
                this.$emit('loadMore')
            }
        }
    }
</script>


<!-- ------- ListCard ------- -->
<template>
    <view>
        <!-- 基础卡片 -->
        <view class="list-card" v-if="item.mode === 'base'" @click="goAtricleDetail">
            <view class="list-card-img">
                <image class="image" :src="item.cover[0] ? item.cover[0] : '/static/img/logo.jpeg'" mode="aspectFill"></image>
            </view>
            <view class="list-card-content">
                <view class="list-card-content-title">
                    <text class="text">{{item.title}}</text>
                    <SaveLikes :articleId="item._id"></SaveLikes>
                </view>
                <view class="list-card-content-desc">
                    <view class="article-type">
                        {{item.classify}}
                    </view>
                    <view class="browse-number">
                        {{item.browse_count}}浏览
                    </view>
                </view>
            </view>
        </view>
        <!-- 多图模式 -->
        <view class="list-card mode-column" v-if="item.mode === 'column'" @click="goAtricleDetail">
            <view class="list-card-top">
                <text class="text">{{item.title}}</text>
                <SaveLikes :articleId="item._id"></SaveLikes>
            </view>
            <view class="list-card-middle">
                <view class="image-container" v-for="(img, index) in item.cover.slice(0, 3)" :key="index">
                    <image class="image" :src="img" mode="aspectFill"></image>
                </view>
            </view>
            <view class="list-card-content-desc list-card-bottom">
                <view class="article-type">
                    {{item.classify}}
                </view>
                <view class="browse-number">
                    {{item.browse_count}}浏览
                </view>
            </view>
        </view>
        <!-- 大图模式 -->
        <view class="list-card mode-image" v-if="item.mode==='image'" @click="goAtricleDetail">
            <view class="list-card-top">
                <view class="image-container">
                    <image class="image" :src="item.cover[0]" mode="aspectFill"></image>
                </view>
            </view>
            <view class="list-card-middle">
                <text class="text">{{item.title}}</text>
                <SaveLikes :articleId="item._id"></SaveLikes>
            </view>
            <view class="list-card-content-desc list-card-bottom">
                <view class="article-type">
                    {{item.classify}}
                </view>
                <view class="browse-number">
                    {{item.browse_count}}浏览
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        name:"ListCard",
        props: {
            item: Object
        },
        data() {
            return {

            };
        },
        methods: {
            goAtricleDetail() {
                console.log('goAtricleDetail')
            }
        }
    }
</script>

运行结果及报错内容

img

看下wxml有没有渲染出来

请问解决了吗,我也遇到这个问题了

吗的,类似的问题,ios,安卓页面渲染出错,出现两个相同标签,代码只写了一个,H5确实正常,难搞