如何在 JSX 中使用 amp-state？

Question

我正在 React 項目中創建 Google amp-page，點擊后需要獲取 JSON。

A/C 到amp.dev ，我可以使用 amp-state 來獲取遠程數據

作為

<amp-state id="shirts" [src]="'/shirts/sizesAndPrices?sku=' + selected.sku" />

我如何在 JSX 中做同樣的事情，因為以這種格式編寫 [src] 會導致錯誤

任何建議都會有所幫助。 提前致謝

Answer 1

您可以將[src]替換為data-amp-bind-src 。 為 JSX 語法兼容性引入了后一種語法。

Answer 2

我不知道這是正確的方法，但我認為，如果有更好的方法，或者以任何方式不推薦，請評論

我需要根據所選選項切換選項的可見性

<amp-selector
    layout="container"
    class="radio-selector"
    on="select: AMP.setState({
    selectedOption: event.targetOption,
})">
        <div option="a_show">Option A</div>
        <div option="b_show">Option B</div>
        <div option="c_show">Option C</div>
</amp-selector>
<div className="options"
    dangerouslySetInnerHTML={{
        __html: `
            <p [class]="selectedOption == 'a_show' ? 'show' : 'hide'" class="show">a</p>
            <p [class]="selectedOption == 'b_show' ? 'show' : 'hide'" class="hide">b</p>
            <p [class]="selectedOption == 'c_show' ? 'show' : 'hide'" class="hide">c</p>
        `
        }}
/>