Vuejs2 “数据属性”；第条；已声明为道具。改为使用默认值

代码：

---

Vue2.1.10 Chrome开发者工具中的警告：

您在

数据和
道具两个位置都添加了
文章
。它应该是其中之一，这就是为什么你会得到错误。您必须将其从某个位置移除，如果您从父组件传递它，则将其保留为道具。如果这是本地实例数据，请将其保存在vue
data
块中

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

一旦在props中声明了
文章
，就不需要在side data中返回它。见下文

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

如果您使用的是TypeScript，那么您可能已经为prop指定了一个值

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

  data () {}, 

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

换成这个

@Component
export default class HelloWorld extends Vue {
  @Prop({ type: Array }) users = []; // wrong, do not assign to a prop
}

导出默认值{props:{article:{type:Object}}，数据（）{return{article:this.article}，方法：{itemClick（）{console.log（'itemClick'）；}}；我被你的代码弄糊涂了，因为它看起来和OP中的例子一样。我遗漏了什么吗？@codeMonkey我现在也不记得了，我在写答案时是怎么想的，代码似乎和问题中的一样，但是我看到问题后来被编辑，代码被添加了。代码前的这三行也解释了解决方案。希望这会有帮助。为什么这是投票最多的，它解决不了问题anything@Saurabh，你能修正一下答案吗？很混乱Mixin还可能引入与同名道具冲突的数据属性。假设你想改变道具，这样做将导致
避免直接改变道具，因为每当父组件重新渲染时，该值将被覆盖。相反，使用基于道具值的数据或计算属性。
错误。
...
@Prop({ type: Array }) users;
...