如何使用laravel + VueJS

时间:2019-02-20 01:37:14

标签: html laravel laravel-5 vue.js vuejs2

如何使用外键显示用户名? 我有2张桌子: 用户和部门,一个部门只有一个部门,而一个用户只能是一个部门的部门。因此,我认为这是“一对一的关系”。 部门表将“ user_id”作为表用户的外键。 在Vue中,我有:

<tr v-for="departement in departements" :key="id" >
                <td>{{departement.id }}</td>
                <td>{{departement.name }}</td>
                <td>{{departement.user_id }}</td>
                <td>{{departement.bio }}</td>

我想从具有user_id的用户表中显示用户的名称。 谢谢。


不起作用 部门负责人:

public function index()
{
    return Departement::where('name','!=','admin')->latest()->paginate(100);
    $departements = Departement::with('chief')->get();
    return response()->ajax($departements, 200);
}

我是对的吗?

2 个答案:

答案 0 :(得分:0)

您需要先定义关系。

部门模式

public function chief()
{
    return $this->belongsTo('App\User', 'user_id');
}

现在通过急切加载的部门获取数据。

控制器功能

$departments = Department::with('cheif')->get();

现在,您可以访问Cheif对象中的特定department对象。

在Vue中

<td>{{ department.cheif.name }}</td>

答案 1 :(得分:0)

  1. 发出获取请求以获取用户
mounted () {
  axios.get('some/api/users')
  .then(res => {
    this.$set(this, 'users', this.users.reduce((accum, user) => accum[user.id] = user, {}))
    // transform the JSON to an object that maps to the user id
  })
}
  1. 在您的模板中
<tr v-for="departement in departements" :key="id" >
                <td>{{departement.id }}</td>
                <td>{{departement.name }}</td>
                <td>{{departement.user_id }}</td>
                <td>{{departement.bio }}</td>
                <td>{{users[department.user_id].name}}</td>