美文网首页
在循环中使用插槽--作用域插槽

在循环中使用插槽--作用域插槽

作者: 胖鱼尾巴 | 来源:发表于2018-07-27 09:06 被阅读20次
A组件内容
 <li class="product_item" v-for="(item,index) in imgs" :key="index" >
        <a @click="$router.push('/home/goodsdetail/' + item.id)">
            <div style="height:180px">
                <img v-lazy="item.src" alt="">
            </div>
            <p class="mui-ellipsis ds_ellipsis mui-text-left">12345 </p>
            <div class="price_cart">
                <span>&yen;560.00</span>
                <slot :item="item"/>
            </div>
        </a>
    </li>
// imgs通过props传入
B组件中使用A组件
<A :imgs="imgs">
   <button class="ds_addshopcart" slot-
   scope="slotProps">cart</button>
</A>

相关文章

  • Vue-使用插槽

    二。具名卡槽 作用域插槽:插槽循环时使用

  • 18、Vue3 作用域插槽

    作用域插槽:让插槽内容能够访问子组件中,vue2中作用域插槽使用slot-scope,vue3中使用v-slot ...

  • vue----slot插槽

    插槽分类 匿名插槽 具名插槽 作用域插槽

  • 2.插槽

    匿名插槽 具名插槽 作用域插槽

  • vue3中的插槽

    插槽 默认插槽 具名插槽,v-slot可以简写为# 动态插槽 #[dynamicSlotName] 作用域插槽(...

  • 【转发】具名插槽简写和作用域插槽

    10. [组件]具名插槽简写和作用域插槽 在父模板中确定插槽位置时,使用了v-slot:one这种方法,其实这个语...

  • vue中slot插槽的使用

    插槽的种类:1、默认插槽、具名插槽、作用域插槽、解构插槽、动态插槽几种。转原文:https://www.jians...

  • 在循环中使用插槽--作用域插槽

    A组件内容 B组件中使用A组件

  • 2019-02-15 vue组件基础篇5

    作用域插槽续此例的用意主要是介绍作用域插槽的用法1.允许组件自定义应该如何渲染列表每一项。2.作用域插槽的使用场景...

  • jsx中插槽的写法

    作用域插槽 scopedSlots: (2.6.0+) 一个暴露传入的作用域插槽的对象。也以函数形式暴露普通插槽。...

网友评论

      本文标题:在循环中使用插槽--作用域插槽

      本文链接:https://www.haomeiwen.com/subject/cahwmftx.html