0

我是 Livewire 的新手，我正在尝试使用 Jetstream/Livewire/TailwindCSS 在 Laravel 8 中使用模式密码确认。在向用户提供一些敏感信息之前，我想将此作为附加的保护层。根据https://jetstream.laravel.com/2.x/features/password-confirmation.html（#Modal Confirmation Via Livewire）中的文档，我应该能够创建一个组件，然后调用该操作来请求密码确认在执行我的其余代码之前。但是，我无法让它发挥作用。
我的组件（\App\Http\Livewire\TestComponent.php）：

<?php

namespace App\Http\Livewire;

use Livewire\Component;

class TestComponent extends Component
{
    public function doSomething(){
        $this->ensurePasswordIsConfirmed();
        //do something here to provide sensitive information, but for now:
        dd('hello world');
    }
}

和我的视图文件：

<!-- some other stuff -->
<x-jet-confirms-password wire:then="doSomething">
    <x-jet-button type="button" wire:loading.attr="disabled">
        {{ __('Click Me') }}
    </x-jet-button>
</x-jet-confirms-password>
<!-- rest of page -->

我希望单击该按钮并显示密码确认模式，但 UI 上没有任何反应，控制台显示如下错误：

Alpine：无法在 Livewire 组件之外引用“$wire”（在 SupportAlpine.js 中）

高山错误：“TypeError：null 不是对象（评估'wireEl.__livewire'）”表达式：“$wire.startConfirmingPassword('88430b463c8820be758732f8dbb3f7de')”（在 app.js 中）

未处理的承诺拒绝：TypeError：null 不是对象（评估'wireEl.__livewire'）（在 SupportAlpine.js 中）

页面上的其他组件工作正常。我不知道我错过了什么，但我敢肯定它一定很简单。有任何想法吗？这将不胜感激。提前致谢！

4

0 回答 0