Thiết lập trình xử lý sự kiện Python trong Pyscript yêu cầu xử lý đặc biệt. Pyodide cung cấp proxy để các sự kiện DOM có thể sử dụng các hàm Python làm hàm gọi lại
Để tạo proxy, hãy gọi hàm pyodide.create_proxy[] []
1
2
3
4
từ pyodide nhập tạo_proxy
# Tạo proxy Python cho chức năng gọi lại
function_proxy = create_proxy[myFunction]
Hàm Python myFunction là một hàm Python bình thường sẽ được gọi trong một sự kiện
1
2
3
def myFunction[].
# làm điều gì đó ở đây
vượt qua
Để gán chức năng proxy cho người nghe
1
2
# Đặt người nghe thành cuộc gọi lại
tài liệu. getElementById["nút"].addEventListener["click", function_proxy]
Ví dụ về Pyscript
Dưới đây là một ví dụ hoàn chỉnh tăng bộ đếm cho mỗi lần nhấn nút. Bạn có thể xem ví dụ này trên trang web của tôi
Ví dụ về ủy quyền nút
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
Nút Event Proxy
. nút {
màu nền. #4CAF50; /* Xanh lục */
đường viền. không;
màu. trắng;
phần đệm. 15px 32px;
căn chỉnh văn bản. trung tâm;
trang trí văn bản. không;
hiển thị. chặn nội tuyến;
cỡ chữ. 16px;
}
Cái này example shows how to process a button event
Loading page, please wait .. .
Click Me
từ js nhập tài liệu
từ pyodide nhập create_proxy
đếm = 0
def button_click[sự kiện]:
toàn cầu số lượng
đếm += 1
tài liệu. getElementById["msg"].innerHTML = 'Đã nhấp vào nút ' + str[count]
def thiết lập[].
# Trang đã sẵn sàng, xóa "trang đang tải"
tài liệu. getElementById["msg"].innerHTML = ''
# Tạo một JsProxy cho chức năng gọi lại
click_proxy = create_proxy[button_click]
# Đặt người nghe thành cuộc gọi lại
e = tài liệu. getElementById["nút"]
e. addEventListener["click", click_proxy]
thiết lập[]
Gọi lại dựa trên thời gian
Các nhà phát triển Python thường viết mã thủ tục. Khi thiết kế cho trình duyệt, bạn muốn cẩn thận để không khóa giao diện người dùng. Trình duyệt web cung cấp một luồng cho ứng dụng web. Để sử dụng nhiều chủ đề hơn, bạn phải sử dụng Công nhân web. Đôi khi bạn muốn thực hiện các tác vụ theo lịch trình, chẳng hạn như cập nhật báo giá chứng khoán, làm mới nội dung trang, v.v. Các trình duyệt cung cấp API setInterval[] [link] để gọi lại ứng dụng của bạn trong một khoảng thời gian cố định
Ví dụ này thiết lập gọi lại sau mỗi 1.000 ms và cập nhật trang trình duyệt bằng bộ đếm. Khi bộ đếm đạt 15, cuộc gọi lại khoảng thời gian bị hủy
Ví dụ proxy khoảng thời gian
Lưu ý rằng cuộc gọi tương tự đến create_proxy[] được sử dụng
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
Loading page .. .
nhập js
từ js nhập tài liệu
từ pyodide nhập create_proxy
bộ đếm = 0
tài liệu. getElementById["status"].innerHTML = 'Python được tải và chạy. '
def myFunc[param]:
bộ đếm toàn cầu, interval_id
bộ đếm += 1
tài liệu. getElementById["msg"].innerHTML = "Counter = " + str[counter]
# Dừng bộ hẹn giờ Khoảng thời gian ở 15
nếu phản đối == 15:
tài liệu. getElementById["status"].innerHTML = 'Hẹn giờ ngắt quãng đã dừng'
js. clearInterval[interval_id]
# Tạo proxy cho cuộc gọi lại
proxy = create_proxy[myFunc]
# Bắt đầu hẹn giờ Khoảng thời gian cho mỗi 1.000 ms
interval_id = js. setInterval[proxy, 1000, "a parameter"];
Tóm lược
Giao diện với HTML và JavaScript khá dễ thực hiện. Pyscript và Pyodide đã tạo ra các thư viện và giao diện rất đẹp để phát triển Python trên trình duyệt
Thêm thông tin
- Các bài viết khác mà tôi đã viết trên Pyscript
- MDN – Tham khảo sự kiện
- MDN – Mục tiêu sự kiện. addEventListener[]
- MDN. setInterval[]
- MDN. ClearInterval[]
tín dụng nhiếp ảnh
Tôi viết bài miễn phí về công nghệ. Gần đây, tôi đã biết về Pexels. com cung cấp hình ảnh miễn phí. Hình ảnh trong bài viết này do Tina Nord tại Pexels cung cấp
John Hanley
Tôi thiết kế phần mềm cho các hệ thống cấp doanh nghiệp và trung tâm dữ liệu. Nền tảng của tôi là hơn 30 năm về ảo hóa lưu trữ [SCSI, FC, iSCSI, mảng đĩa, hình ảnh]. Hơn 20 năm trong lĩnh vực nhận dạng, bảo mật và pháp y
Trong hơn 14 năm qua, tôi đã làm việc trong lĩnh vực đám mây [AWS, Azure, Google, Alibaba, IBM, Oracle] để thiết kế các giải pháp phần mềm lai và đa đám mây. Tôi là một MVP/GDE với một số