数据属性已声明为 prop

Question

请问我在 JavaScript 文件中做错了什么。

我是 Vue.js 的新手，非常感谢您的帮助

Plotly.vue

<template src="../../views/plotlychartshtml/plotlycharts.html"></template>

<script>
    import BarChart from '@/assets/javascripts/plotlychartsBar'

     export default {
    components: {
      'vue-plotly': BarChart 
    }
  }
</script>

plotlycharts.html

<div class="wrapper">
    <div>
        <vue-plotly></vue-plotly>
    </div>
</div>

plotlychartsBar.js

import VuePlotly from '@statnett/vue-plotly'

export default {
  extends: VuePlotly,
  data() {
      return {
         datacollection: {
            data: [{ 
              x: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], 
              y: [40, 20, 30, 50, 90, 10, 20, 40, 50, 70, 90, 100] ,
              name: 'Plotly',
              type: 'bar',
            }]
         },
         layout: {},
         options: {},
      }
   },
    mounted() {
      this.datacollection
   }
}

我正在学习本教程 https://github.com/statnett/vue-plotly，但在正确使用我的 JS 代码时遇到了挑战。

我收到此错误消息，但不确定如何解决它：

vue.esm.js?efeb:591 [Vue warn]: The data property "options" is already declared as a prop. Use prop default value instead.

found in

---> <BarPlotly> at C:\Users\martinha\vue-plotly\src\Plotly.vue
       <Plotlycharts> at src/components/vuePlotly/Plotlycharts.vue
         <App> at src/App.vue
           <Root>

found in

---> <BarPlotly> at C:\Users\martinha\vue-plotly\src\Plotly.vue
       <Plotlycharts> at src/components/vuePlotly/Plotlycharts.vue
         <App> at src/App.vue
           <Root>

Answer 1

似乎您在 plotlychartsBar.js extends VuePlotly 中的组件声明（已经将 options 声明为 prop）在它的子 components 中声明它 :

export default { //extends: VuePlotly, <= incorrect components: { VuePlotly, },

Answer 2

当我遇到同样的问题时，我的搜索中出现了这个问题。

我在使用 @nuxtjs/composition-api 模块时在 Nuxt 中遇到此错误。

我在我的路由器组件中使用 @nuxtjs/composition-api。我在调用 localVue.use(VueCompositionAPI ).

的测试中也使用了 createLocalVue

看起来，如果您在组件中使用 @nuxtjs/composition-api，则不需要将 localVue.use(VueCompositionAPI ) 添加到测试中。

数据属性已声明为 prop

The data property is already declared as a prop

vue.js

数据 属性 已声明为 prop

The data property is already declared as a prop

vue.js

数据属性已声明为 prop