cdn 方式构建的 vue 项目怎么自定义组件及复用

[TmacV2]

用脚手架的项目，.vue 单组件文件可以导入实现复用。 那 cdn 方式的项目怎么搞？ 想了想可以把组件选项写在 js 文件中 然后用到的时候引用一下 js 文件进行组件注册？

[HiCode]

@TmacV2

“一个页面根据不同标签页切换显示不同的 view ”，不太确定你说的是不是类似 vant 里面的 tab 标签页功能：

https://youzan.github.io/vant/#/zh-CN/tab

tab 标签页的话比较好实现，页面内用一个变量简单控制不同内容的展示即可(v-if 或 v-show)，在点击标签按钮时更改这个变量的值，就会自动切换。

如果你说的“一个页面根据不同标签页切换显示不同的 view ”是指 Vue-rap 里的 layout，可以用公共组件+状态变量来实现。参考 menu.vue ，这个组件监测 menu_active 值的变化。其他引用此组件的页面，在各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值。这样 menu.vue 组件就会自动菜单状态。

而 menu.vue 里面，则可以通过 v-link="'pages/main'"来控制跳转到不同的页面。

[TmacV2]

例如 menu 组件里标签栏有四个导航标签 ，我就做四个 view 组件，每个组件都引用 menu 组件 。在这些 view 组件各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值吗
那会产生 4 个 menu 组件实例 好像也不对。

第一次做前端项目 提问有点幼稚 请见谅哟

[TmacV2]

@HiCode 例如 menu 组件里标签栏有四个导航标签 ，我就做四个 view 组件，每个组件都引用 menu 组件 。在这些 view 组件各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值吗 那会产生 4 个 menu 组件实例 好像也不对。第一次做前端项目 提问有点幼稚 请见谅哟

[HiCode]

@TmacV2 你的理解没有错，确实会存在 4 个 menu 的实例。我最近打算搞 PC 后台类的系统页面，会增加 layout 的功能。

[TmacV2]

@HiCode 期待你的更新 回复你之前我想了一下午 最终没想出答案 所以还是问你了

[TmacV2]

@HiCode 大佬 有没有基于 vue 的 demo 给我学习学习 前端知识点也挺多的 想快点上手

[HiCode]

@TmacV2 我自己的学习路径是看各个 vue ui 框架的代码和他们的实现，参考学习他们的思路，例如

https://github.com/heyui/heyui

https://github.com/heyui/heyui-admin

成长比较大还是要靠实际项目，一般我先设定自己想要做什么东西，然后这个东西有哪些项目可以参考，就去看他们思路，然后对着抄一份作业。哈哈哈哈哈哈，所以实在谈不上是大佬。

我其实是 PHP 后端来的，不过现在也准备用 deno，全面改 js 了。

[TmacV2]

@HiCode 我去码云上找一些简单的后台管理 vue 项目观摩学习一下先

[TmacV2]

@HiCode 老哥 看到你更新了 jqvue 项目了

[HiCode]

@TmacV2 谢谢支持，嗯……我春节撸了一个新的，https://gitee.com/haimadongli001/vue-web-loader

这个可以直接支持 vue-router，并且可以通过 kbone 编译成小程序。

当然，为了保证兼容性 vue 组件里面还是要按 es5 的格式去写，用 es6+部分浏览器会不兼容。

哈哈哈哈哈，谢谢支持！

[TmacV2]

@HiCode 老哥，你 https://gitee.com/haimadongli001/vue-web-loader 这个项目能开放给我 fork 一下吗？ 找不到了