当前位置: 首页 > Web前端 > HTML5

VUE实战9:Switch(开关)控件、输入框输入系列、管理后台Admin

时间:2023-04-05 18:25:51 HTML5

接下来几篇文章会介绍使用的输入框系列,今天介绍一下常用的调用方法,因为RXEditor需要复杂的输入功能,下面的例子会使用VUE的组件来动态调用,没有今天的直观。控件的实现原理是一样的,区别在于调用方式。今天这个例子的调用代码是专门写的。写完后还得还原作文。开关控件(Switch)的实现效果:给组件起个好听的名字,叫它RxSwitch。调用代码:组件代码:原理:当鼠标点击时,switchv-model(inputValue)的值,模板根据inputValue的值决定是否显示on状态,并通过css伪类::之后。有关详细信息,请参阅CSS代码。感谢您耐心阅读。详细代码可参考Github:https://github.com/vularsoft/studio-ui如有问题欢迎留言交流。