vue switch用法
时间: 2023-07-26 20:03:53 浏览: 150
vue自定义switch开关组件,实现样式可自行更改
Vue中的`<template>`标签中可以使用`<switch>`标签来创建一个开关按钮组件。开关按钮组件是由两个状态的切换来实现的,可以用于表示开或关闭一个选项。
以下是一个简单的Vue switch用法的示例:
```
<template>
<div>
<switch v-model="isChecked"></switch>
<p>Switch状态: {{ isChecked }}</p>
</div>
</template>
<script>
export default {
data() {
return {
isChecked: false
}
}
}
</script>
```
在上面的示例中,我们创建了一个`<switch>`组件,并将`v-model`指令绑定到`isChecked`变量上。`isChecked`变量的值将通过`<p>`标签来显示。当我们切换开关时,`isChecked`的值也会随之改变。
阅读全文