Vue.js 实现微信公众号菜单编辑器功能(一)
发布时间:2020-12-14 17:08:45 所属栏目:资源 来源:网络整理
导读:学习一段时间Vue.js,于是想尝试着做一个像微信平台里那样的菜单编辑器,在这里分享下 具体样式代码查看项目 创建一个vue实例 将菜单数据渲染到模版上 这里使用v-if和v-for将数据渲染到模版上,最多会有3个主菜单以及每个主菜单最多会有5个子菜单。 {{ btn.n
学习一段时间Vue.js,于是想尝试着做一个像微信平台里那样的菜单编辑器,在这里分享下 具体样式代码查看项目 创建一个vue实例将菜单数据渲染到模版上这里使用v-if和v-for将数据渲染到模版上,最多会有3个主菜单以及每个主菜单最多会有5个子菜单。 给vue实例添加方法在vue实例中给methods对象中添加我们自定义的方法 给菜单绑定方法当点击菜单触发selectedMenu方法,点击添加按钮触发添加addMenu方法。使用v-on来监听事件,它的缩写是@ 监听点击事件@click ,为了防止子菜单点击事件冒泡的主菜单,则使用.stop事件修饰符来阻止冒泡@click.stop 使用v-bind:class来添加切换菜单选中时的class。:class为缩写 下篇给大家介绍 Vue.js 实现微信公众号菜单编辑器功能(二) 总结以上所述是小编给大家介绍的Vue.js 实现微信公众号菜单编辑器功能。编程之家 52php.cn 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |