Oct 24, 2025

Level 17

Livewire\Exceptions\MethodNotFoundException

Hi I have a livewire component for adding comments to a post.

Now after add a comment I get the error "Livewire\Exceptions\MethodNotFoundException." "Unable to call component method. Public method [createComment] not found on component"

I don't get It.

This is my comment component. Blade

@auth
    <div x-data="{
            focused: {{ $parentComment ? 'true' : 'false' }},
            isEdit: {{ $commentModel ? 'true' : 'false'}},
            init() {
                if (this.isEdit || this.focused)
                    this.$refs.input.focus();

                $wire.on('commentCreated', () => {
                    this.focused = false;
                })
            }
    }" class="mb-4">
        <div class="mb-2">
            <textarea x-ref="input" wire:model="comment" @click="focused = true"
                      id="comment"
                      name="comment"
                      class="bg-transparent text-sm text-primary-muted placeholder-primary-muted rounded-lg block w-full p-2.5 border border-secondary/30 focus:border-secondary focus:outline-none focus:ring-0"
                      :rows="isEdit || focused ? '2' : '1'"
                      placeholder="{{ __('Leave a comment') }}"
                      required
            ></textarea>
            <x-form.error for="comment" class="mt-2"/>
        </div>
        <div class="flex justify-end space-x-2" :class="isEdit || focused ? '' : 'hidden'">
            <x-button.secondary @click="focused = false; isEdit = false; $wire.dispatch('cancelEditing')"
                                type="button">
                {{ __('Cancel') }}
            </x-button.secondary>
            <x-button.default wire:click="createComment" type="submit">
                {{ __('Send') }}
            </x-button.default>
        </div>
    </div>
@else
    <div class="flex justify-end items-center space-x-1 rounded-lg p-4">
        <p class="text-primary text-xs">{{ __('Only registered users can leave a comment.') }}</p>
        <a href="{{route('login')}}"
           class="text-xs text-primary underline hover:text-secondary hover:underline focus:outline-none focus:text-secondary focus:underline">
            {{ __('Login') }}
        </a>
    </div>
@endauth

And this is my php file.

<?php

namespace App\Livewire\Comments;

use App\Models\Comment;
use App\Models\Post;
use Livewire\Attributes\Validate;
use Livewire\Component;

class CommentCreate extends Component
{
    #[Validate('required|min:3|max:200', onUpdate: true)]
    public string $comment;

    public Post $post;

    public ?Comment $commentModel = null;

    public ?Comment $parentComment = null;

    public function mount(Post $post, $commentModel = null, $parentComment = null)
    {
        $this->post = $post;
        $this->commentModel = $commentModel;
        $this->comment = $commentModel ? $commentModel->comment : '';

        $this->parentComment = $parentComment;
    }

    public function createComment()
    {
        $this->validate();

        $user = auth()->user();
        if (! $user) {
            return $this->redirect('/login');
        }

        if ($this->commentModel) {
            if ($this->commentModel->user_id != $user->id) {
                return response('You are not allowed to perform this action', 403);
            }

            $this->commentModel->comment = $this->comment;
            $this->commentModel->save();

            $this->comment = '';
            $this->dispatch('commentUpdated');
        } else {

            $comment = Comment::create([
                'comment' => $this->comment,
                'post_id' => $this->post->id,
                'user_id' => $user->id,
                'parent_id' => $this->parentComment?->id,
            ]);

            $this->dispatch('commentCreated', $comment->id);
            $this->comment = '';
        }
    }

    public function render()
    {
        return view('livewire.comments.comment-create');
    }
}

Can someone help me.

LaryAI

6 months ago

Level 58

Certainly! The error:

Livewire\Exceptions\MethodNotFoundException
Unable to call component method. Public method [createComment] not found on component

usually means that Livewire cannot find a public createComment method on your component when it is triggered from the frontend.

Common Causes & Solutions

1. Method Visibility

Double check that your createComment method is indeed marked as public. From your code, it looks correct:

public function createComment()
{
    // ...
}

2. Component Configuration

Check that your Livewire component is correctly referenced in your Blade file. For Livewire v3 (which uses livewire:) or @livewire, this looks like:

<livewire:comments.comment-create :post="$post" />

Or in older syntax:

@livewire('comments.comment-create', ['post' => $post])

If you have recently renamed your class or file, clear view and Livewire caches:

php artisan view:clear
php artisan livewire:discover
php artisan cache:clear

3. Event Trigger Type

How are you triggering createComment?

In your Blade, you have:

<x-button.default wire:click="createComment" type="submit">
    {{ __('Send') }}
</x-button.default>

If the button is nested in a <form>, and you submit the form, it might submit traditionally (via browser) instead of triggering the Livewire method unless you use wire:submit.prevent on the <form> itself.

If this button is not in a <form> tag, or if you are using only wire:click, you are fine. If it is part of a <form>, you should:

EITHER use wire:submit.prevent="createComment" in the <form> tag
OR make your button type "button", not "submit"

Example:

<form wire:submit.prevent="createComment">
    <!-- textarea and buttons -->
    <x-button.default type="submit">
        {{ __('Send') }}
    </x-button.default>
</form>

<x-button.default wire:click="createComment" type="button">
    {{ __('Send') }}
</x-button.default>

4. Naming Consistency

Ensure your Livewire component class and file match the registration:

File: app/Livewire/Comments/CommentCreate.php
Class: App\Livewire\Comments\CommentCreate

5. Version Issues

If you're using Livewire v3, make sure you have updated all use statements and attributes (like #[Validate]), and your Blade syntax follows the v3 conventions.

Summary Solution Checklist

Ensure your createComment method is public.
Ensure your Livewire component's file/class name matches and is discoverable (run php artisan livewire:discover).
Make sure the event is triggered as intended: use either wire:click on buttons of type="button", or wire:submit.prevent on forms.
Clear your caches after any changes.

Example Blade Adjustment

If you are in a <form>, update like so:

<form wire:submit.prevent="createComment">
    <textarea ...></textarea>
    <!-- Buttons ... -->
    <x-button.default type="submit">
        {{ __('Send') }}
    </x-button.default>
</form>

Or, stick with a button and make the type explicit:

<x-button.default wire:click="createComment" type="button">
    {{ __('Send') }}
</x-button.default>

Try these steps. If you're still seeing errors, ensure you:

Have the up-to-date Livewire version
Have not made any typos in the method name
Registered the component correctly

Let me know if you need more help after these adjustments!

valentin_vranic

5 months ago

Level 5

I would suggest to follow the example provided by LarryAI, with adding wire:submit="createComment", thus it will disable all the input fields, and the submit button while making the roundtrip from frontend and backend, making it more secure, and preventing submiting a form multiple times.

Please or to participate in this conversation.