vant - Navbar slot 插槽使用


 
 
//子组件
<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>

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。