Возникли проблемы при получении данных из базы данных методом Axios Get - PullRequest
Новая
       10

Возникли проблемы при получении данных из базы данных методом Axios Get

0 голосов
/ 05 ноября 2018

Задача

Все работает нормально, но когда я пытаюсь поместить «response.data» в этот массив «this.chat.messages или this.allMessages» и записывает его, консоль показывает «undefined», но когда я записываю все данные, как "response.data" показывает данные четко.

Контроллер сообщений 

public function index()
{
    return Message::with('user')->get();
}
public function store(Request $request)
{
    $user = Auth::user();
    $message=auth()->user()->messages()->create(['message'=>$request->message]);
    broadcast(new MessageSent($user, $message->load('user')))->toOthers();
    return response(['status'=>'Message sent successfully','message'=>$message]);
}

Код от внешнего интерфейса 

<script>
    const url = 'http://localhost:8000/messages/';
    const app = new Vue({
        el: '#app',
        data() {
            return {
                message: null,
                chat: {
                    messages:[]
                },
                allMessages: []
            }
        },
        methods: {
            sendMessage() {
                if (!this.message) {
                    alert('please write something.');
                }

                axios.post('/messages/', {message: this.message}).then(response => {
                    this.message=null;
                    this.chat.messages.push(response.data.message);
                    console.log("Message Sent");
                });
            },
            fetchMessages() {
                axios.get(url).then(response => {
                        this.chat.messages = response.date;
                        console.log(this.chat.messages);
                        console.log("Message Loaded");
                    }
                )
                .catch((error) => {
                    // Error
                    if (error.response) {
                        console.log(error.response.data);
                        console.log(error.response.status);
                        console.log(error.response.headers);
                    } else if (error.request) {
                        console.log(error.request);
                    } else {
                        console.log('Error', error.message);
                    }
                    console.log(error.config);
                });
            }
        },
        created(){
            this.fetchMessages();
        }
    });
</script>

1 Ответ

0 голосов
/ 05 ноября 2018

Поскольку ваш response не содержит свойство с именем date, которое возвращает undefined, поэтому измените 

this.chat.messages = response.date;

до 

this.chat.messages = response.data;

Надеюсь, это поможет.

...