Question

我想通过vuejs发布与帖子相关的评论。这是路线：

Route::post('/posts/{post}/comments', 'RoleController@store');

功能是：

    public function store($id)
{
    $this->validate(request(), [
        'body' => 'required|min:3'
    ], [
        'body.min' => 'bla bla'
    ]);
    $user = auth()->id();
    $post = Post::find($id);
    Comment::create([
        'cbody' => request('body'),
        'post_id' => $post->id,
        'user_id' => $user,
        'cstatus' => 0
    ]);
}

在vue文件中我有：

   export default {
    data() {
        return {
            data : {
                body : ''
            },
            errors : new Errors(),
            success : {
                status : false,
                message : ''
            }
        }
    },
    methods : {
        onSubmit() {
            axios.post(`/posts/${this.post.id}/comments` , this.data)
                .then(response => {
                    this.success = {
                        status : true,
                        message : this.$swal("bla bla ", "bla bla ", "info")
                    };
                    this.data = {
                        body : ''
                    }
                })
                .catch(error => this.errors.record(error.response.data) );
                    }
                }
            }

但是我得到了与axios定义的行相关的错误：

 Cannot read property 'id' of undefined

如果我硬编码

'post_id' => 66,

然后删除属性ID：

 axios.post(`/posts/${this.post}/comments` , this.data)

它有效。我认为主要的问题是我不知道如何用params在axios中写这个url。

Answer 1

我无法通过post slug解决这个问题。但没有slu，这些代码救了我。在我的组件中发送帖子作为onSubmit函数的参数：

<template>
    <div>
        <form @submit.prevent="onSubmit(post)" @keydown="errors.clear($event.target.name)">
                <div :class="['form-group' , { 'has-error' : errors.has('body')}]">
                    <label for="body"> write comment</label>
                    <textarea class="form-control" v-model="data.body" name="body" id="body" rows="7"></textarea>
                    <div class="error" v-if="errors.has('body')">{{ errors.get('body') }}</div>
                </div>
                <div class="form-group">
                    <button type="submit" :disabled="errors.any()" class="btn btn-default">submit</button>
                </div>
        </form>

    </div>
</template>

脚本部分我编辑axios url并将Argument放到onSubmit函数：

<script>       
export default {
            props: ['post'],
            data() {
                return {
                    data : {
                     body : '',
                     post:'',
                    },
                    errors : new Errors(),
                    success : {
                        status : false,
                        message : ''
                    }
                }
            },
            methods : {
                onSubmit(post) {
                    axios.post('/posts/'+post+'/comments', this.data)
                        .then(response => {
                            this.success = {
                                status : true,
                            };
                            this.data = {
                                body : ''
                            }
                        })
                        .catch(error => this.errors.record(error.response.data) );
                            }
                        }
                    }
    </script>

并使用我的组件中的道具，如：

<create-comment :post={{ $post->id }}></create-comment>

用这条路线：

Route::post('/posts/{post}/comments', 'RoleController@store');

和这个功能：

public function store(Post $post)
{
    $this->validate(request() , [
        'body' => 'required|min:5'
    ]);

    $user = auth()->user();

    $post->comments()->create([
        'user_id' => $user->id,
        'cbody' => request('body'),
        'cstatus'=>0
    ]);
}

一切正常，但尝试使用post.slug

message No query results for model [App\Post].

错误。这是我的帖子模型：

<?php

namespace App;

use Cviebrock\EloquentSluggable\Sluggable;
use Illuminate\Database\Eloquent\Model;

class Post extends Model
{
    protected $guarded=[];
    use Sluggable;
    public function user()
    {
        return $this->belongsTo(User::class);

    }
    public function comments()
    {
        return $this->hasMany(Comment::class);


    }
    public function tags()
    {
        return $this->belongsToMany(Tag::class)
                 ->select(['id','name']);
    }
    public function sluggable()
    {
       return[
           'slug'=>[
               'source'=>'title'
           ]
       ];
    }

    public function getRouteKeyName()
    {
        return 'slug';
    }
}

通过laravel 5.5中的vuejs发送帖子请求

1 个答案: