# EscapeHTML ## Composable 實作 ### useEscapeHTML.js ```javascript= javascriptexport const useEscapeHTML = () => { const escapeHTML = (str) => { const escapeMap = { '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;', '/': '&#x2F;' }; return str.replace(/[&<>"'\/]/g, (match) => escapeMap[match]); }; return { escapeHTML }; }; ``` ## 頁面使用範例 ### index.vue ``` htmlembedded= <template> <div> <input v-model="content" type="text" placeholder="請輸入內容" > <div> {{ content }} </div> <button @click="convert">轉換</button> </div> </template> <script setup> const { escapeHTML } = useEscapeHTML(); const content = ref(''); const convert = () => { content.value = escapeHTML(content.value); }; </script> ```