相关疑难解决方法(0)

我开始https://laracasts.com/series/learning-vue-step-by-step系列.我停止了Vue,Laravel和AJAX这个课程的错误:

Vue.component('task', {
    template: '#task-template',
    props: ['list'],
    created() {
        this.list = JSON.parse(this.list);
    }
});
new Vue({
    el: '.container'
})

我在main.js中有这段代码

Vue.component('task', {
    template: '#task-template',
    props: ['list'],
    created() {
        this.list = JSON.parse(this.list);
    }
});
new Vue({
    el: '.container'
})

我知道当我覆盖列表道具时问题出在created()中,但我是Vue的新手,所以我完全不知道如何解决它.任何人都知道如何(并请解释原因)来修复它？

首先，我刚刚开始玩 VueJS，所以这不能是这里建议的 VueJS 版本

它可能是以下内容的副本：

• 如何解决[Vue警告]：避免直接修改一个prop，因为它的值会在vue.js 2上被覆盖？- 不同之处在于我只是想用 , 设置v-bind一次值。
• 避免直接改变道具，因为值将被覆盖- 这看起来也有点相似，但解决方案对我不起作用。
• 通过javascript修改VUE组件的正确方法是什么？- 这个解决方案看起来和我的情况差不多
• vuejs 从子组件更新父数据

我的问题始于我的 Html 看起来像这样：

<div id="app">
  <div class="row">
    <div class="form-group col-md-8 col-md-offset-2">
      <birthday-controls
       :birthDay="birthDay"
       :birthMonth="birthMonth"
       :birthYear="birthYear">
      </birthday-controls>
    </div>
  </div>
</div>

和JS：

Vue.component('birthday-controls', {

    template: `<div class="birthday">
    <input type="text" name="year"  placeholder="yyyy" v-model="birthYear" size="4" maxlength="4"/>
    <input type="text" name="month" placeholder="mm" v-show="validYear" v-model="birthMonth" size="3" maxlength="2"/>
    <input type="text" v-show="validYear && validMonth" name="day" placeholder="dd" v-model="birthDay" size="2" maxlength="2"/>
  </div>`,

    props: ['birthDay', 'birthMonth', 'birthYear'],

    computed: { …