学习一段时间Vue.js,于是想尝试着做一个像微信平台里那样的菜单编辑器,在这里分享下
具体样式代码查看项目nofollow" target="_blank" href="https://github.com/hopex/vue-menu">github
创建一个vue实例
<Meta charset="UTF-8">
将菜单数据渲染到模版上
这里使用v-if和v-for将数据渲染到模版上,最多会有3个主菜单以及每个主菜单最多会有5个子菜单。
当点击菜单触发selectedMenu方法,点击添加按钮触发添加addMenu方法。使用v-on来监听事件,它的缩写是@
监听点击事件@click ,为了防止子菜单点击事件冒泡的主菜单,则使用.stop事件修饰符来阻止冒泡@click.stop
下篇给大家介绍 Vue.js 实现微信公众号菜单编辑器功能(二)
以上所述是小编给大家介绍的Vue.js 实现微信公众号菜单编辑器功能。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。