离线状态

2.x

3.x 2.x 1.x

Livewire 中文文档 /

离线状态

通知用户失去互联网连接的时间有时很重要。 Livewire提供了有用的实用程序，可以根据用户的“离线”状态执行操作。

当用户离线后您可以显示在页面上显示特定元素，只需要增加 wire:offline 属性即可。

<div wire:offline>
    You are now offline.
</div>

这个<div> 默认自动隐藏，用户断网之后会自动显示。

<div wire:offline.class="bg-red-300"></div>

当浏览器断网时，这个元素会增加 bg-red-300 类，联网之后会自动去除。

类似 wire:loading 您也可以反过来去除类名：

<div wire:offline.class.remove="bg-green-300" class="bg-green-300"></div>

bg-green-300 类名会在断网后自动移除。

增加 .attr 修饰词允许您离线时增加属性。

<button wire:offline.attr="disabled">Submit</button>

浏览器离线后，按钮会被禁用。

同样也可以反过来使用 .remove 修饰词移除属性

本文章首发在 LearnKu.com 网站上。

Markdown 文本

版主 2.0k 声望

更多文章去我的博客(www.zxdstyle.cn) 看看

从零开发一个电商项目，功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等

以构建论坛项目 LaraBBS 为线索，展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。

讨论数量: 0

暂无话题~