layui导航栏下拉菜单无法正常显示

习惯了Boostrap的样式使用风格，第一次在vue项目中使用layui时，多少有些不适应。这一点在导航栏二级菜单时尤其明显o(╥﹏╥)o。

目标是像官网demo一样的

实际上，我写出来的只有一排文字，△下拉菜单的图标都不出现。查了下官网和网上解说是因为导航的hover效果、二级菜单等功能，依赖element模块，需要先引入。引入方法如下图：

重点来了：没有生效！！！

        导航栏我是把它单独封装成子组件集成到主页面的，所以引入element模块的方法也是放在了主页的mounted里，但是还是不行。后来我把这个方法放在index.html中就可以了。

不过这样产生了一个新问题：当我从登录页跳转到这个主页面的时候，下拉菜单还是没有渲染出来。只有在当前页面刷新才能出来。

最后，我研究了下layui加载form表单时需要form.render()；我就比着葫芦画个瓢加了element.render();然后就解决了。

layui.use('element',()=>{})这个方法最终改为在下拉菜单所在页的mounted里使用（index.html中的layui.use()方法删除）。如果使用layui会大量出现layui.use('XXX',()=>{})类似方法，建议在main.js中封装一个通用的方法，便于全局使用（根据自己需要可以封装更简洁的方法）。

main.js

下拉菜单所在页

layui下拉菜单在html文件里是正常显示的，但是在vue里就不太行。因为是第一次在vue里使用layui，虽然最终解决了，但是不是很清楚其中缘由。

如果有大佬看到这篇文章恳请赐教！！！