developit / developit/htm

Ampersand escapes in text content handled differently to JSX

未關閉
#76 11 則留言 5 個 reaction 已指派 0 人 在 GitHub 檢視
discussion help wanted
主要語言
JavaScript
星號
9k
分支
181
PR 合併指標
30 天內沒有已合併 PR

描述

## Reproduction

With the following code:

```
import htm from "https://unpkg.com/htm@2.1.1/dist/htm.mjs";
import { h } from "https://unpkg.com/preact@8.4.2/dist/preact.mjs";
const html = htm.bind(h);

console.log(html`

<
`)
```

I get a VNode with `.children = ["<"]` — i.e. what I mean to render as `<` gets rendered as `<` instead.

## Expected results

Testing this in JSX via say , `

<
` gets transformed into `h("div", ["<"]);` as I originally expected.

I haven't poked into how they are doing this… seems like something that ultimately relies on a lookup table.

## Workaround

I am able to escape via string interpolation (e.g. `${'<'}` instead of `<`). Changing the last line in my sample code to:

```
// …

console.log(html`

${'<'}
`)
```

Results in a VNode with `.children = ["<"]` as I need. Is this the recommended style?

貢獻指南

開啟貢獻指南

研究方向

從 reproduction 中展示的 tagged-template 入口開始:htm.bind(h) 以及 template 內的文字內容。以提供的 VNode 輸出為基準,比較字面值 ampersand escape 和插值字串的標記化方式。完成的標準是:諸如 \u0026lt; 這樣的文字實體能產生對應的解碼文字,與 JSX 保持一致,同時不破壞插值。

由索引模型根據 Issue 內容生成。

評估

技術堆疊
javascript
領域
frontend
Issue 類型
缺陷
難度
3/5
預估耗時
1-2 天
活躍度
停滯
描述清晰度
基本清楚
新手友好度
38/100

把新 issue 寄到你的電子郵件信箱

精選適合新手參與的 GitHub issue 摘要。