首页 > 编程语言 > 详细

vant - Navbar slot 插槽使用

时间:2019-09-30 13:26:20      阅读:2538      评论:0      收藏:0      [点我收藏+]
//子组件
<template>
  <van-nav-bar>
    <slot slot="left"  name="left"></slot>
    <slot slot="title" name="title"></slot>
    <slot slot="right" name="right"></slot>
  </van-nav-bar>
</template>

<script>
export default {
  name: ‘navbar‘
}
</script>

<style>

</style>

//父组件
<template>
  <NavBar>
    <span slot="left" class="van-nav-bar__text">返回</span>
    <div slot="title" class="van-nav-bar__title van-ellipsis">我是home标题</div>
    <van-icon name="search" slot="right" />
  </NavBar>
</template>

<script>
import NavBar from ‘@/components/NavBar‘

export default {
  name: ‘index‘,
  components: { NavBar }
}
</script>

<style>

</style>

 

vant - Navbar slot 插槽使用

原文:https://www.cnblogs.com/ibos/p/11612107.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!