zhangbao1992

2534 经验值

@JellyBool 我在 App.vue 中给 mounted 方法中给 this.initialTodos 赋值并没起作用。

  1. 下面这样可以给组件初始化 todo 列表。

export default {
  name: 'app',
  components: {
    Todos
  },
  data() {
    return {
      initialTodos: [
        {title: '123', completed: true},
      ],
    }
  },
  mounted() {
    this.axios.get('http://homestead.app/api/todos').then((response) => {
      console.log(response.data)  
      //this.initialTodos = response.data
    })
  }
}
</script>
  1. 但这样的话,todo 列表为空。

export default {
  name: 'app',
  components: {
    Todos
  },
  data() {
    return {
      initialTodos: [
        // {title: '123', completed: true},
      ],
    }
  },
  mounted() {
    this.axios.get('http://homestead.app/api/todos').then((response) => {
      console.log(response.data)  
      this.initialTodos = response.data
    })
  }
}
</script>

并且后台数据能正常拿到。这是后台 API。

Route::get('/todos', function (Request $request) {
    return [
        [ 'title' => '吃早饭', 'completed' => false ],
        [ 'title' => '吃午饭', 'completed' => false ],
        [ 'title' => '吃晚饭', 'completed' => false ],
    ];
});

请教一下。被圆括号(())括起来的是表达式,但表达式里的不还是解构赋值吗?

为什么没有报错 Identifier 'name' has already been declared 呢?而且下面 console 还能打印出来 nameage 的值。

是不是

({ name, age } = Tom);

// 等同于
{
    name = Tom.name;
    age = Tom.age;
}

这我不太理解。

嗯 对的。既然是作为两个组件用,行为就该不一致啊。:-D

嗯对的 如果在同一个父组件里使用了两次 todo-items 组件,现在的代码就会引起实例行为一致。最好在注册组件的时候,都有自己的 todos。我是这样意思:

  1. 父组件

new Vue({
    el: '#app',
    data: {
        initialTodos: [
            // ...
        ]
    }
});
  1. todo-items 组件

Vue.component('todo-items', {
    template: '#todo-items-template',
    props: ['initialTodos'],
    data() {
        return {
            todos: this.initialTodos ? [].concat(this.initialTodos) : [],
            newTodo: { title: '', completed: false }
        }
    },
        ...
  1. #app 中使用 todo-items 组件

<div id="app" class="container">
    <div class="row">
        <div class="col-md-6">
            <todo-items v-bind:initial-todos="initialTodos"></todo-items>
        </div>
        <div class="col-md-6">
            <todo-items v-bind:initial-todos="initialTodos"></todo-items>
        </div>
    </div>
</div>

我说每个组件实例都有自己的 todos,就是 todos 是这样创建的

todos: this.initialTodos ? [].concat(this.initialTodos) : [],

这样使用,对吗?我是这样做,才避免两个组件实例行为一致的。

但是 todo-form 里的提交按钮和 todo-items 里的删除按钮不都应该操作同一个 todos 吗?

@JellyBool 请教一下。

todo-items 组件和 todo-form 组件操作的变量 todos 是同一个吗?如果这样的话

<todo-items :todos="todos"></todo-items>
<todo-form :todos="todos"></todo-form>

变量 todos 就是以引用的形式传递的了,对吗?

@JellyBool 下面这种写法,好像有两种绑定关系。

<form v-on:submit.prevent="addTodo(newTodo)">
  1. 绑定 addTodo method

  2. 绑定 newTodo 这个 data

对不?

你代码的这部分写错了

return $this->roles()->contains('name', $role);

应该是

return $this->roles->contains('name', $role);

我的这个版本的 Laravel(version 5.3.31)已经没有 yarn.lock 这个文件了。

另外在 Yarn 官方安装 msi 文件,也是久久下不下来。难道 Yarn 也被墙了吗?

这种方式对于 Laravel 5.3 版本无效。解决方式是在使用 Faker 实例的地方的顶部, 重新实例化一个 Faker 实例。

就像这样:

$factory->define(App\User::class, function (Faker\Generator $faker) {
    $faker = Faker\Factory::create('zh_CN');

    static $password;

    return [
        'name' => $faker->name,
        'email' => $faker->unique()->safeEmail,
        'password' => $password ?: $password = bcrypt('secret'),
        'remember_token' => str_random(10),
    ];
});