uniapp v-html跑马灯

// 组件布局

    <!--跑马灯-->
<view class="home-notice">
    <view class="game-notice-icon-box">
        <image class="game-notice-icon" src="/static/game-notice.png" mode="widthFix">
    </view>
    
    <view class="notice-box">
        <view class="_notice">
            <swiper class="_swiper tc" @change="slideChange" indicator-dots="false" autoplay="true" :interval="2000" :circular="true" display-multiple-items="1" :duration="18000" :acceleration="true" easing-function="linear">
                <swiper-item class="swiper-item2 uni-bg-red" v-for="(item, index) in marqueeList" :key="index" >
                    {{item.id}}:<view class="swiper-content" v-html="item.content"></view>
                </swiper-item>
            </swiper>
        </view>
    </view>
</view>

// css部份

    /* 主通知容器样式 */
.home-notice {
    margin: 30rpx 30rpx 10rpx 30rpx;
    height: 60rpx;
    background-color: #fff;
    border-radius: 10rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    box-shadow: 0 0 18rpx #ccc;
    overflow: hidden;

    /* 通知图标容器样式 */
    .game-notice-icon-box {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        width: 70rpx;
        background: #FFEEEF;
    }

    /* 通知图标样式 */
    .game-notice-icon {
        width: 32rpx;
        height: 27rpx;
    }
}

/* 通知内容容器样式 */
.notice-box {
    position: relative;
    width: calc(100% - 70rpx);

    /* 实际通知内容样式 */
    ._notice {
        position: absolute;
        left: 0;
        top: -20rpx;
        min-width: calc(750rpx * 2);
        box-sizing: border-box;

        /* 每一条通知的样式 */
        .swiper-item2 {
            position: absolute;
            left: 0;
            top: 0;
            min-width: 750rpx;
        }
    }

    /* 通知内容文本样式 */
    .swiper-content {
        display: inline-block;
    }
}