vue 使用自定义插槽继承attribute属性方法

vue在自定义属性中使用插槽时利用attribute继承进行传值的方法。

父组件代码

<template>
<div class='home'>
  <datePicker date-time="time">wuhan</datePicker>
</div>
</template>
<script>
import datePicker from './datePicker.vue' 
export default {
name: 'Home',
components:{
    datePicker
},
data(){
  return{

  }
},
methods: {
  
},
}
</script>
<style lang='less' scoped>
</style>

子组件代码

在上面父组件中定义的 date-time="time" 默认继承在子组件的根节点上，使用 inheritAttrs:false 取消默认继承禁用之后，如果想绑定在某个元素上可以绑定 $attrs 

<template>
<div class='data'>
  <button class="default" v-bind="$attrs">
      <slot></slot>
    </button>
</div>
</template>
<script>

export default {
  inheritAttrs:false, //取消默认继承节点
   name: 'datePicker',

}
</script>
<style lang='less' scoped>
</style>

上述就是关于继承 attribute 属性方法基本用法（默认继承原则、取消默认继承、绑定特定元素等），有不理解的朋友欢迎私信我们交流喔。