سلام استاد ما دقیقا مثل شما کد زدیم فقط خروجی که مرورگر بهمون می‌ده تو اون قالبی که تعریف کردیم نیست به شکل json parse هستش علتش چیه ؟

کدهای من به این شکل هستش:

class ChatController extends Controller

{
    public function __construct()
    {
        $this->middleware('auth');
    }
    public function index()
    {
        $messages=Message::with(['user'])->latest()->take(5)->get();
        return response()->json($messages,200);
    }
}
// Messages.vue

<script>
export default {
    data(){
        return {
            messages: []
        }
    },
    mounted() {
        axios.get('/chat/messages').then((response) => {
            // console.log(response);
            this.messages = response.data
        })
    }
}
script>
<style lang="scss">
.chat {
    &__messages {
        height: 400px;
        max-height: 400px;
        overflow-y: scroll;
    }
}
style>
//Message.vue
<template>
    <div class="chat__message">
        <strong class="chat__message-user">
            {{ message.user.name }}
        strong>
        <span class="chat__message-timestamp">
            {{ message.created_at }}
        span>
        <p class="chat__message-body">
            {{ message.body }}
        p>
    div>
template>
<script>
export default {
    props: ['message']
}
script>
<style lang="scss">
.chat {
    &__message {
        padding: 15px;
        border-bottom: 1px solid #eee;
        &--own {
            background-color: #f0f0f0;
        }
        &-user {
            font-weight: 800;
        }
        &-timestamp {
            color: #aaa;
        }
        &-body {
            margin-bottom: 0;
            white-space: pre-wrap;
        }
    }
}
style>
// web.php
Route::get('chat/messages',[ChatController::class,'index'])->name('messages');


خروجی برنامه به شکل زیر نشون می‌ده و نمیاد داخل قالبی که تعریف کردیم نشون بده :

[{"id": 256,
"user_id": 1,
"body": "تا هر شش تای عکس‌ها را پاک کند و صحبت از هجده ساعت درس بسازد. و دشوارترین کار همین بود که دخالت کردم. یک روز که.",
"created_at": "2021-12-11T07:04:24.000000Z",
"updated_at": "2021-12-11T07:04:24.000000Z",
"user": {"id": 1,
"provider": null,
"provider_id": null,
"name": "user1@gmail.com",
"email": "user1@gmail.com",
"email_verified_at": "2021-12-01T13:31:12.000000Z",
"phone_number": "09901271909",
"has_two_factor": 0,
"avatar": null,
"created_at": "2021-12-05T13:30:59.000000Z",
"updated_at": "2021-12-05T13:30:59.000000Z",
"address": null
}
},
{"id": 257,
"user_id": 1,
"body": "حیفتون نیومد؟... دستی روی شانه‌ام نشست و فریادم را خواباند. برگشتم پدرش بود. او هم دعوت بشود و این نره‌خر حالا.",
"created_at": "2021-12-11T07:04:24.000000Z",
"updated_at": "2021-12-11T07:04:24.000000Z",
"user": {"id": 1,
"provider": null,
"provider_id": null,
"name": "user1@gmail.com",
"email": "user1@gmail.com",
"email_verified_at": "2021-12-01T13:31:12.000000Z",
"phone_number": "09901271909",
"has_two_factor": 0,
"avatar": null,
"created_at": "2021-12-05T13:30:59.000000Z",
"updated_at": "2021-12-05T13:30:59.000000Z",
"address": null
}
},
{"id": 258,
"user_id": 1,
"body": "پسرک فاعل به مدرسه سر زدم و در گوشم آهسته گفت که قضیه حل شد. سی صد تومان از بودجه‌ی دولت بسته به این زودی‌ها از.",
"created_at": "2021-12-11T07:04:24.000000Z",
"updated_at": "2021-12-11T07:04:24.000000Z",
"user": {"id": 1,
"provider": null,
"provider_id": null,
"name": "user1@gmail.com",
"email": "user1@gmail.com",
"email_verified_at": "2021-12-01T13:31:12.000000Z",
"phone_number": "09901271909",
"has_two_factor": 0,
"avatar": null,
"created_at": "2021-12-05T13:30:59.000000Z",
"updated_at": "2021-12-05T13:30:59.000000Z",
"address": null
}
},
{"id": 259,
"user_id": 1,
"body": "بیجک زغال دستش بود و: - نگاه کنید آقا... روی گچ دیوار با مداد قرمز و نه مجبور خواهم بود برای فرار از اتلاف وقت، در.",
"created_at": "2021-12-11T07:04:24.000000Z",
"updated_at": "2021-12-11T07:04:24.000000Z",
"user": {"id": 1,
"provider": null,
"provider_id": null,
"name": "user1@gmail.com",
"email": "user1@gmail.com",
"email_verified_at": "2021-12-01T13:31:12.000000Z",
"phone_number": "09901271909",
"has_two_factor": 0,
"avatar": null,
"created_at": "2021-12-05T13:30:59.000000Z",
"updated_at": "2021-12-05T13:30:59.000000Z",
"address": null
}
},
{"id": 260,
"user_id": 1,
"body": "بکشند آقا. رئیس‌شون رو که گرفتند چه جونی کندم آقا تا حالی‌شون کنم که دست ور دارند آقا. و از در بزرگ آهنی مدرسه.",
"created_at": "2021-12-11T07:04:24.000000Z",
"updated_at": "2021-12-11T07:04:24.000000Z",
"user": {"id": 1,
"provider": null,
"provider_id": null,
"name": "user1@gmail.com",
"email": "user1@gmail.com",
"email_verified_at": "2021-12-01T13:31:12.000000Z",
"phone_number": "09901271909",
"has_two_factor": 0,
"avatar": null,
"created_at": "2021-12-05T13:30:59.000000Z",
"updated_at": "2021-12-05T13:30:59.000000Z",
"address": null
}
}
]