无关的 non-props 属性（标题）已传递给组件，但无法传递

Question

runtime-core.esm-bundler.js?d2dd:38 [Vue warn]: Extraneous non-props attributes (title) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. 
  at <ProductTable title="Product List" > 
  at <Home onVnodeUnmounted=fn<onVnodeUnmounted> ref=Ref< undefined > > 
  at <RouterView> 
  at <App>

这是我在 Vue 应用程序的 chrome 控制台中遇到的错误。下面是我的 parent 视图组件。我正在尝试向其中添加多个组件，例如主页内容和页脚。

<template>
  <div class="home">
    <ProductTable title="Product List"/>
    <Footer title="I am the child"/>
  </div>
</template>

<script>
import ProductTable from '@/components/ProductTable.vue'
import Footer from '@/components/Footer.vue'
import Functions from '@/components/ProductListFunctions.js'


export default {
  name: 'Home',
  components: {
    ProductTable,
    Footer
  }
}
</script>

感谢任何帮助，因为我无法弄清楚。该错误只是一个警告，不会影响任何页面。但离开会很好。干杯。

Answer 1

您应该将 inheritAttrs:false 添加到子组件中：

export default{
inheritAttrs:false
...
}

无关的 non-props 属性（标题）已传递给组件，但无法传递

Extraneous non-props attributes (title) were passed to component but could not be

javascript

vue.js

vue-component