vue2.5.16 警告: 组件内不推荐修改Propsvoid mutating a prop directly since the value will be overwritten whenev

场景

给组件传递参数设置 props : ['question_lists'], .getJson获取到了questionlists的数据在 . g e t J s o n 获 取 到 了 q u e s t i o n l i s t s 的 数 据 在 $.getJson获取到了question_lists的数据 在$.getJson的的回调函数中 自然需要将得到的数据赋值给question_lists
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "question_lists"

分析

1. 翻译:  避免直接修改prop属性, 因为父级在重新加载的时候  prop也会被复写
2. Vue从1.x升级到2.x之后 就不推荐组件内直接修改  推荐使用data 或者computed来解决 其实只需要在组件内部data 声明一个空的属性就可以了

参考文档

https://cn.vuejs.org/v2/guide/migration.html#%E4%BF%AE%E6%94%B9-Props-%E5%BC%83%E7%94%A8

解决

    <script>Vue.component('list_question_template', {template : '#list_question',// props : ['question_lists'],data : function(){return {question_lists : {}}},created : function () {var vm = this;var url = '/api/test';$.getJSON(url).done(function(response){vm.question_lists = response;});},methods : {deleteItem : function (question) {var index = this.question_lists.indexOf(question);this.question_lists.splice(index, 1)}}});new Vue({el: '#app_test'});script>

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！