前端——》vue中自定义switch开关样式美化修改

分隔线以上为表单中的switch开关

---

分割线以下为表格中的switch开关 

 

 实现步骤：一：先建一个vue页面，取名switch

<template>
    <div>
        <span class="weui-switch" :class="{'weui-switch-on' : isChecked}" :value="value" @click="toggle" style="position:relative">
            <div v-if="isChecked && direction.length > 0" style="width:100%;height:100%;position:absolute;padding:0 5px;line-height:20px;color:#FFF;user-select:none">
                {
  {dir