layui開關遇見的坑以及用法總結

1.先看官方文檔：

官方效果：

 

 

注意：如果你直接把文檔中這塊代碼粘貼過去是不會有效果的，如果問為什么，下面是原因：

 

 

說的很清楚了，必須有form進行渲染，也就是要放到form中，當然別忘了引入一套layui,下面代碼才可以正常顯示

<form class="layui-form">
 <div class="layui-form-item">
    <label class="layui-form-label">開關</label>
    <div class="layui-input-block">
      <input type="checkbox" name="switch" lay-skin="switch">
    </div>
  </div>
</form>

開關的監聽：

 

 

下面是一個案例：展示數據table是拼接的，所以table之外我首先套了一程form,然后將我的數據和開關拼接上去，注意此時雖然有了form，有了開關，但是不會有開關效果，因為開關是動態拼接上去的，所以需要重新渲染一下：

下面是代碼：

 

 

 

js:

 

 

轉載：https://blog.csdn.net/royal1235/article/details/83218696