Gói
@lia-labs/elements
Sao chép trang
Cái Lia SDK dưới dạng các phần tử tùy chỉnh, cho bất kỳ trang nào và bất kỳ khung nào. Đặt một phần tử trên trang và nó sẽ thực hiện công việc của nó khi nó ở đó.
npm install @lia-labs/elementsHoặc không cần bước xây dựng:
<script src="https://unpkg.com/@lia-labs/elements/dist/auto.global.js"></script>Xây dựng kịch bản đăng ký các phần tử khi nó được tải và đặt toàn bộ SDK trên window.liaElements. Với một bundler, đăng ký chúng một lần:
import { defineLiaElements } from '@lia-labs/elements';
defineLiaElements();#Một ứng dụng
<lia-app auto-ready></lia-app>
<lia-main-button text="Buy extra lives"></lia-main-button>
<button id="play">Play</button>
<div id="game"></div>
<script>
document.querySelector('lia-main-button').addEventListener('lia-click', function () {
liaElements.pay('extra-lives');
});
document.querySelector('lia-app').addEventListener('lia-ready', function (event) {
console.log('Hello, @' + event.detail.player.name);
});
// While a game runs: a back button and closing confirmation, gone when the game ends.
var game = document.getElementById('game');
document.getElementById('play').onclick = function () {
game.innerHTML = '<lia-back-button></lia-back-button><lia-closing-confirmation></lia-closing-confirmation>';
game.querySelector('lia-back-button').addEventListener('lia-click', function () { game.innerHTML = ''; });
};
</script>Các phần tử không vẽ gì trên trang của bạn: mỗi phần tử điều khiển một phần của Lia trong khi nó'trong tài liệu. Xóa nó (hoặc cha mẹ) sẽ ẩn nút hoặc kết thúc việc giữ. Các phần tử bên trong một hidden cha mẹ vẫn được tính: thêm và xóa chúng thay vì vậy.
#Các phần tử
| Phần tử | Trong khi nó'trên trang | Thuộc tính | Sự kiện |
|---|---|---|---|
<lia-app> | Các cuộc gọi init(), sau đó thiết lập ready (hoặc error) trên chính nó | auto-ready gọi ready() sau khung hình đầu tiên; no-css-vars | lia-ready (chi tiết: kết quả khởi tạo), lia-error |
<lia-main-button> | Lia'nút chính | text, color, text-color, disabled, progress, shine | lia-click |
<lia-secondary-button> | Nút phụ | Cùng một, và position | lia-click |
<lia-back-button> | Thanh tiêu đề'nút quay lại | lia-click | |
<lia-settings-button> | Cài đặt trong menu ⋯ | lia-click | |
<lia-closing-confirmation> | Lia hỏi trước khi đóng | ||
<lia-swipe-lock> | Một lần vuốt xuống đã thắng't đóng bảng | ||
<lia-banner> | Một thanh thông báo Lia được cố định ở mép trong khi nó'trên trang (trang của bạn ngắn lại để vừa với nó) | position: bottom (mặc định) hoặc top |
Thay đổi một thuộc tính sẽ cập nhật nút: button.setAttribute('progress', '') hiển thị đồng hồ đang quay, button.toggleAttribute('disabled', true) làm nó mờ đi.
Được dịch tự động. Tiếng Anh là nguồn tin cậy. Đọc bằng tiếng Anh