web-dev-qa-db-ja.com

データプロパティ「article」は、すでに小道具として宣言されています。代わりにpropのデフォルト値を使用してください

コード:

export default {
    props: {
        article: {type: Object}
    },
    data () {
        return {article: this.article}
    }, 
    methods: {
        itemClick () {
            console.log('itemClick');
        }
    }
};

Vue2.1.10警告Chrome開発者ツール: データプロパティ "article"は既にpropとして宣言されています。代わりにpropデフォルト値を使用してください。

31
BadWaka

articledataの両方の場所にpropsを追加しました。これらのいずれかである必要があり、それがエラーを取得している理由です。親コンポーネントから渡す場合は、場所の1つを削除する必要があり、それを小道具として保持します。これがローカルインスタンスデータである場合、vue dataブロックに保持します。

export default {
  props: {
    article: {
      type: Object
    }
  },
  data() {
    return {
      article: this.article
    }
  },
  methods: {
    itemClick() {
      console.log('itemClick');
    }
  }
};
34
Saurabh

Propsでarticleを宣言したら、サイドデータで返す必要はありません。下記参照。

export default {
  props: {
    article: {type: Object}
  },

  data () {}, 

  methods: {
    itemClick () {
      console.log('itemClick');
    }
  }
};
9