v2.5.2
Giriş yap

axios ile post işleminden sonra anlık işlemlerde ki hata.

rotaile
276 defa görüntülendi

vuejs 3 ve laravel 10 kullanıyorum.

şu şekilde axios ile post işlemi gerçekleştikten sonra
.then kısmında array olan posts dizisine dönen veriyi ekliyorum.

posts değerlerinin bağlı olduğu ilişkileri controller kısmında load ederek döndürüyorum.

gönderilerin beğenme, kaydetme yorum gibi aksiyonlarıda var.
Fakat biz son eklenen gönderiyi push ile eklediğimiz için yine axios ile yaptığım beğenme işlemi geçersiz oluyor.

Sayfa yenilendikten sonra son eklenen gönderi görüntülenmeye devem ediyor. Tüm işlemlerde yapılabiliyor, yorum, beğeni ve kaydetme gibi.

Fakat ben spa(single page app) yaptığım için bu dönen değerin sayfa yenilenmeden aksiyon almasını istiyorum.

Umarım anlatabilmişimdir sorunu

async postStore() {
  if (this.post.content.length > 2) {
     this.isPostingPost = true
     await axios.post('/akis-gonderiler/gonderi-ekle', this.post)
        .then(response => {
            //bu kısımda array olan posts dizisine dönen veriyi ekliyorum
            this.posts.push(response.data.post);
            this.post.content = ''
            this.errors = []
        })
        .catch(error => {
            this.errors = error.response.data.errors;
        })
        .finally(() => {
            this.isPostingPost = false;
        });
}
},


Laravel kısmı şu şekilde.

public function store(Request $request){

$request->validate([
    'content' => 'required|min:3',
]);

$post =  Post::create([
    'content' => $request->content,
    'user_id' => Auth::id(),
    'views' => rand(100, 999),
    'status' => 1,
]);

$post->load('user', 'comments', 'likes');
return response()->json(['post' => $post]);
}

axios ile beğeni işlemi şu şekilde.

bu kısımda tersine çevirdiğim için işlem gerçekleşmiş gibi gönünüyor fakat sayfa yenilenince işlem yapılmadı olarak görnüyor.

_post.is_like = !post.islike;

async likePost(post) {
    try {
        const response = await axios.post(`/akis-gonderiler/gonderi-begen/${post.encode_id}`);
        post.is_like = !post.is_like;
        post.likes = response.data.likes;
    } catch (error) {
        console.error('Beğeni işlemi başarısız:', error);
    }
},

ilkerndaskin
559 gün önce

spa yapıyorsan keşke react kullansan, ama sorununu async await çözecektir istersen birkaç makale oku ES7 async diye araştır