Hacktoberfest 2026: die Issues, die Maintainer für den Oktober markiert haben – offen und einsteigerfreundlich. Hacktoberfest-Issues durchsuchen

Find a way to allow "@" in attribute?

Offen
#235 0 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Bewertung

Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Anfängerfreundlichkeit
38/100
Issue-Typ
Feature
Klarheit
Größtenteils klar
Aktivitätsstatus
Veraltet
Tech-Stack
javascript
Bereich
frontend

Rechercherichtung

Beginne mit der bereitgestellten htm/preact-Reproduktion und untersuche, wie Attribute setAttribute erreichen, insbesondere den Fall @click. Vergleiche das Verhalten mit dem x-on:click-Workaround und den verlinkten Alpine-Issues; abgeschlossen ist die Aufgabe, wenn Alpines @-Syntax funktioniert, ohne dass Nutzer sie umschreiben müssen, wobei die Reproduktion als Prüfung dient.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Beschreibung

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.

Vorherrschende Sprache
JavaScript
Sterne
9k
Forks
181
Keine gemergten PRs in 30 T.

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lesen Sie das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreiben Sie ins Issue, dass Sie es übernehmen — das erspart doppelte Arbeit.
  3. Forken Sie das Repository und arbeiten Sie in einem Branch.
  4. Öffnen Sie einen Pull Request, der die Issue-Nummer nennt.

Mehr aus developit/htm

Alle Issues in developit/htm

Ähnliche Issues

Weitere Issues zu JavaScript

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.