其他分享
首页 > 其他分享> > $attrs和inheritAttrs灵活封装组件

$attrs和inheritAttrs灵活封装组件

作者:互联网

// 父组件中引入的子组件、在父组件的子组件标签上添加属性配置、会渲染到子组件的最外层 div上、
// 防止这种情况发生、在子组件中设置 export default { inheritAttrs: false  } 就能禁止渲染到子组件外出 div上
// 子组件要被父组件渲染的标签上用 v-bind="$attrs" 就能将父组件的配置都渲染在这个标签上

// 父组件:示例
<div>
  <myInput type="password" />    
</div>

// 子组件会被渲染成下面这样:示例
<div type="password">
  <input />    
</div>

// 父组件
<div>
  <myInput type="password" />    
</div>

// 子组件
<div>
  <input v-bind="$attrs" />    
</div>
export default {
    inheritAttrs: false
}

标签:封装,渲染,标签,inheritAttrs,示例,export,attrs,组件
来源: https://blog.csdn.net/weixin_43323913/article/details/123130907