我目前正在使用一个事件发射器来呈现一些Javascript,以显示条带信用卡输入。理想的结果是显示一个模式,然后使用Javascript事件监听器呈现信用卡输入。
我有一个这样的按钮来显示Jetstream模式:
<x-jet-secondary-button type="button" wire:click="showCreateModal">Show</x-jet-secondary-button>
在Livewire组件中,此方法是:
public function showCreateModal()
{
$this->emit('loadCard');
$this->showCreate = true;
}
这就是Javascript事件监听器:
<script type="text/javascript">
var STRIPE = Stripe('{{ config("cashier.key") }}');
var elements = STRIPE.elements();
Livewire.on('loadCard', function () {
setTimeout(function() {
var card = elements.create('card');
card.mount('#card-element');
}, 500)
});
</script>
我试过3到4种不同的版本,但到目前为止都没有成功。如有任何帮助/反馈,将不胜感激。
发现了问题。我正在将Vue加载到@livewireScripts blade指令顶部的页面中。通过删除Vue,解决了该问题。