uni-app 微信小程序中 v-for 和 slot 一起使用时表现异常

uni-app 微信小程序中 v-for 和 slot 一起使用时表现异常 产品分类:uniapp/小程序/微信

项目
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 Windows10 20H2
第三方开发者工具版本号 1.05.2111300
基础库版本号 2.22.0
项目创建方式 CLI
CLI版本号 2.0.1-33520211229002

操作步骤:

同 bug 描述

预期结果:

使用 slot 和 不使用 slot 在 v-for 中渲染保持一致

实际结果:

使用 slot 时在 v-for 中无法正确渲染

bug描述:

需要实现一个弹幕的功能, 根据时间轴动态将弹幕push到barragesActive中、 等该弹幕卷动完毕(2秒)再从barragesActive中移除、 由于弹幕组件需要泛用并可以自定义内容, 弹幕组件故有如下结构:

<template>  
  <view class="barrages">  
    <view  
      v-for="barrage of barragesActive"  
      class="barrage"  
      :key="barrage.id"  
      :id="barrage.id"  
      :data-id="barrage.id"  
      :style="{  
        top: barrage.top,  
      }"  
    >  
      <image class="avatar" :src="barrage.avatar"></image>  
      <slot v-bind:barrage="barrage">  
        <view class="name">{{ barrage.name }}</view>  
        <view class="content">{{ barrage.content }}</view>  
      </slot>  
    </view>  
  </view>  
</template>

更多关于uni-app 微信小程序中 v-for 和 slot 一起使用时表现异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app 微信小程序中 v-for 和 slot 一起使用时表现异常的实战教程也可以访问 https://www.itying.com/category-93-b0.html


单独引这个插槽会怎么样

回到顶部