我正在制作一個網站并學習 AlpineJS。我正在嘗試制作一個自定義“復選框”（來自 tailwindcss），以使人們同意服務條款。
<div class="flex-shrink-0">
<!-- Enabled: "bg-indigo-600", Not Enabled: "bg-gray-200" -->
<button x-show="!isOpen" @click="isOpen = !isOpen" type="button" role="switch" aria-checked="false">
<span class="sr-only">Agree to policies</span>
<!-- Enabled: "translate-x-5", Not Enabled: "translate-x-0" -->
<span aria-hidden="true"></span>
</button>
<button x-show="isOpen" @click="isOpen = !isOpen" type="button" role="switch" aria-checked="false">
<span class="sr-only">Agree to policies</span>
<!-- Enabled: "translate-x-5", Not Enabled: "translate-x-0" -->
<span aria-hidden="true"></span>
</button>
</div>
現在可能已經有更好的方法來執行此自定義復選框，因為現在我將在您單擊它時替換整個復選框。所以如果你有這方面的建議，請告訴我！
使用燒瓶，我需要獲取此復選框的值。但由于它不是一個真正的復選框，我不能只通過 POST 請求獲取資料。所以我想我可以使用 hidden 來決議帶有 POST 請求的資料。
<input type="hidden" name="terms" value="">
我希望 'true' 或 'false' 中的值可以在我的代碼中使用它。我似乎無法在網上的任何地方找到一個好的解決方案，但我確定是一個。有人有什么想法嗎？
uj5u.com熱心網友回復：
Alpine.js 使用該x-model指令將變數系結到輸入元素。只需將此隱藏的輸入元素放在表單中isOpen存在變數的任何位置：
<input type="hidden" name="terms" x-model="isOpen" />
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/443959.html