javascript - 模型 Laravel 和 Vue 上的自定义方法

Question

我目前正在尝试在我的 laravel 项目中实现一个书签功能，我正在使用这个设计。 Bookmark 表是 User 和 Post 表的枢轴，多对多关系

  public function BookmarkPost(Request $request,$id)
{
    $book = Auth::guard('api')->user()->bookmarks()->attach($id);

     return response()->json( $book);
}

/**
 * Unfavorite a particular post
 *
 * @param  Post $post
 * @return Response
 */
public function unBookmarkPost(Request $request,$id)
{
    $unbook = Auth::guard('api')->user()->bookmarks()->detach($id);

    return response()->json( $unbook);
}

有 BookmarkController 的代码

在用户模型中定义关系后，我创建了一个方法来检查帖子是否已在我的帖子模型中收藏

 public function bookmarked()
    {
           return (bool) Bookmark::where('user_id', Auth::guard('web')->id())
                              ->where('job_id', $this->id)
                              ->first();

      }

有 Post 模型的代码。这应该检查帖子是否已加入书签。

所以我还设置了一个接受两个 props 的 vue 组件

<bookmark-icon :id="job.id" :bookmarked="job.bookmarked ? true : false "></bookmark-icon>

所以我现在的主要问题是我正在使用书签图标作为子组件，我将如何调用 Vue 实例上的 bookmarked() 方法，如果它是 Blade 的话，它会是

{{$job->bookmarked()}}

我如何使用 Vue 获得它？

Answer 1

你不能在 vuejs 中访问 eloquent 表单。

但是您可以在将数据传递给 vuejs 之前使用关系。

为了做到这一点，你必须急于加载它 (如果它对您来说是新的，请阅读文档，非常有用的东西，尤其是在性能方面) 您可以阅读这篇文章“Importance of eager loading”

这就是你如何做到的，类似于下面的代码:

public function load_display()
    {

        $job = Job::bookmarked()->get();

        return response()->json($job );

    }