onclick - mouseup 事件高山 js

Question

alpinejs 中是否有任何 mouseup 事件？@click.away 不适合，因为您实际上需要单击其他地方。在我的情况下，当按下按钮时应该触发一个事件，而当释放鼠标键时应该触发另一个事件，无论课程在哪里。

更新：现在我有这个代码：

        <div x-data="{ buttonPresed: false }">
            <button 
            @click=" buttonPresed = true " 
            class="h-10 w-40 border rounded-lg bg-white text-black font-bold">Some Button</button>
            <div x-show=" buttonPresed === true " class="text-lg text-white font-bold">Button pressed</div>
        </div>

按下按钮后会显示文本“按下按钮”。释放鼠标按钮时，我需要隐藏它（buttonPresed=false）。因此，仅当用户的手指放在鼠标按钮上时才会显示文本。我怎样才能做到这一点？

标签： onclickmouseupalpine.js

Answer 1

您可以将任何 DOM 事件与 Alpine.js 一起使用，x-on:[event-name]或者@[event-name]在这种情况下x-on:mouseup="console.log($event)"，或者@mouseup="console.log($event)"在触发 mouseup 事件时记录它。