Vue Checkbox是Vue.js框架中的一個組件,它是一個可自定義樣式和文本的復選框。Vue Checkbox支持v-model綁定,可以通過更新所綁定的值來控制選中狀態。
<template> <div> <label> <input type="checkbox" v-model="isChecked" /> {{ label }} </label> </div> </template> <script> export default { data() { return { isChecked: false }; }, props: { label: { type: String, default: "Checkbox" } } }; </script>
在上面的示例中,我們定義了一個Vue Checkbox組件,并在其模板中包含了一個label元素和一個input元素。input元素的type屬性設置為checkbox,以創建復選框。我們通過v-model指令將isChecked變量與復選框的選中狀態綁定在一起。最后,我們使用props來定義label屬性,這個屬性可以接受一個字符串類型的值,并且默認值為"Checkbox"。
在使用Vue Checkbox時,我們可以使用CSS來自定義其樣式,可以在label元素上添加class或style屬性,也可以在input元素上添加class或style屬性。可以根據不同的項目需求來自定義Vue Checkbox的樣式。