Find a way to allow "@" in attribute?
Chưa có ai nhận issue này.
Đánh giá
- Độ khó
- 3/5
- Thời gian dự kiến
- 1-2 ngày
- Mức phù hợp với người mới
- 38/100
- Loại issue
- Tính năng
- Độ rõ ràng
- Khá rõ ràng
- Mức độ hoạt động
- Đình trệ
- Công nghệ
- javascript
- Lĩnh vực
- frontend
Hướng nghiên cứu
Bắt đầu với bản tái hiện htm/preact được cung cấp và kiểm tra cách các thuộc tính được truyền tới setAttribute, đặc biệt là trường hợp @click. So sánh hành vi này với workaround x-on:click và các issue Alpine được liên kết; công việc được xem là hoàn thành khi cú pháp @ của Alpine hoạt động mà người dùng không cần viết lại, với bản tái hiện đóng vai trò kiểm tra.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
Both Vue and Alpine have this weird syntax where events get preceded by @. I'm using htm in a library for templating. Preact is more of an implementation detail, and not really exposed to users. I'm seeing someone who uses alpine on the rest of the page and wants an event handler that's handled by alpine in that template. Unfortunately the shorthand syntax doesn't seem to work due to setAttribute.
A reproduction is:
import { render } from "preact";
import { html } from "htm/preact";
// does work
render(
html`
<div x-data="{ open: false }">
<button @click="open = !open">Expand</button>
<span x-show="open">
Content...
</span>
</div>
`,
document.body
);
(workaround is replacing @ to x-on:, but our user wasn't aware of this)
sandbox: https://codesandbox.io/s/festive-wildflower-qeugtn?file=/src/index.js
other relevant issues:
https://github.com/alpinejs/alpine/issues/1235
https://github.com/alpinejs/alpine/issues/396
https://github.com/algolia/instantsearch/issues/5435
I'm guessing no workaround will be possible as it's actually setAttribute throwing, but I wonder if you know something that would avoid users changing their expectations.
- Ngôn ngữ chính
- JavaScript
- Star
- 9k
- Fork
- 181
- Chỉ số merge pull request
- Không có pull request nào được merge trong 30 ngày
Hướng dẫn đóng góp
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của developit/htm
-
Sarthak Đang mở
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 1/100
-
Tugas Đang mở
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 10/100
-
Tugas Đang mở
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 1/100
-
type checking templates Đang mở
Độ khó 5/5 Hơn một tuần Mức phù hợp với người mới 20/100
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 35/100
Tất cả issue của developit/htm
Issue tương tự
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 65/100
-
Theme loads third-party resources on every page (jsdelivr web font, cdnjs Font Awesome) – GDPR Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
docToolchain/docToolchain#1705 ·
-
Timezone select lists one option per character; duplicate "Failed" reason; shared tracker popover id Đang mởbug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
nightscout/nocturne#1414 ·
-
bug v2
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
modelcontextprotocol/inspector#2458 · 1 bình luận ·
-
Mend: dependency security vulnerability status: needs triage 🕵️♀️
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 70/100
carbon-design-system/ibm-products#9907 ·