Vue的$attrs使用

我们在使用组件的过程中，有时需要给被封装的子组件传递Prop，如果prop的值过于庞大写起来会很麻烦，$attrs就解决了这一问题

//父组件
<template>
  <div class="home">
    <About :msg="msg"></About>
  </div>
</template>

<script>
import About from '@/views/About'
export default {
  name: 'Home',
  components: {
    About
  },
  data(){
    return{
      msg:'123'
    }
  }
}
</script>

//子组件
<template>
  <div class="about">
    <input type="text" :placeholder="$attrs.msg">
  </div>
</template>
<script>
export default {
  inheritAttrs:false,
  data(){
    return{

    }
  },
  created(){
  }
}
</script>

这样使用就不需要在声明prop了非常方便