1. 首页
  2. 编程语言
  3. Javascript
  4. vue3中轻松实现switch功能组件的全过程

vue3中轻松实现switch功能组件的全过程

上传者: 2021-06-08 18:23:37上传 PDF文件 253.63 KB 热度 20次

what编程语言里面,除了使用 if 语句来做条件判断,还有另外一个常用的就是 switch 了。而在 vue 中,官方已经帮助我们实现了 v-if 这个指令,但是还没有 switch ,那我们能不能自己实现一个呢?这篇文章就是来探索这个问题,并且最终实现一个 Switch 组件以终为始先来看看我们希望用户是如何使用 Switch 的用 js 的方式来对比一下:用户可以通过一个 VSwitch 组件来应用 switch 功能通过 case 来确定匹配的条件然后每一个 case 匹配的条件用 template 来表示这样我们已经规定好用户该如何使用了,剩下的其实就是实现了。而 render 函数只要返回对应的 vnode ,那么最终就会被渲染到 view 上。如果你学到的话,那么请用你的小手点个赞呗~~~完整代码扩展思考那其实这里实现的 switch 功能并不完整,如果说用户匹配满足多个条件呢?

用户评论