这是一个创建于 1448 天前的主题，其中的信息可能已经有所发展或是发生改变。
用脚手架的项目，.vue 单组件文件可以导入实现复用。 那 cdn 方式的项目怎么搞？ 想了想可以把组件选项写在 js 文件中 然后用到的时候引用一下 js 文件进行组件注册？
 |
1
VtoExtension 2020-11-22 20:40:59 +08:00
写过一个 Demo，太不习惯了，除非以后插件支持
gitee.com/cloudfile/chat-vue/blob/master/src/components.js |
 |
2
TmacV2 OP a.js
function Test() { return { template: '<div @click="handle">{{data}}</div>', data: function () { return { data: 1 }; }, methods: { handle(){ this.data+=5; } } } } index.html <div id="app"> <Child></Child> </div> <script> // 注册 var Child = Test(); Vue.component('course-sort', Test()) // 创建根实例 new Vue({ el: '#app', components: { Child } }) </script> |
|
3
TmacV2 OP @VtoExtension 老铁 你这里面用了 es6 语法吧
|
 |
4
runze 2020-11-22 21:18:52 +08:00
|
 |
5
galikeoy 2020-11-22 21:22:00 +08:00
呃呃呃，我们是 cli 打包，然后把资源扔到 cdn 上面去
|
 |
6
mxT52CRuqR6o5 2020-11-22 21:24:22 +08:00 via Android
是要古老一点的模块解决方案吗？ seajs 或 requirejs
|
|
8
TmacV2 OP @mxT52CRuqR6o5 感谢 新手了解一下
|
 |
11
beginor 2020-11-23 08:32:47 +08:00 via Android
手写 AMD 模块， 用 require.js 或者 system.js 来加载。
或者直接写 es6 模块， 直接 import， 兼容性差点 |
 |
12
HiCode 2020-11-23 09:20:52 +08:00
大部分前端都是编译好后放到 cdn ；
假定你不想要编译，在 html 页面中直接加载使用 vue 组件，可以参考下面项目： https://gitee.com/tengzhinei/Vue-rap https://gitee.com/haimadongli001/jQuery.Vue.js |
|
16
TmacV2 OP 你用了 Vue-rap 还是 jQuery.Vue.js ？
|
|
19
TmacV2 OP @HiCode 哈哈哈 啥时候能支持一下嵌套理由 我跳转到 demo 里 temp 组件里 然后下面有菜单 根据菜单显示子路由 view https://i.loli.net/2020/11/24/6N9qiBDTlJeFpnr.jpg
|
|
20
TmacV2 OP @HiCode 你的项目里如果有没有需要一个页面根据不同标签页切换显示不同的 view 有的话你要怎么实现。
看了一下 vue-rap 项目 demo 的实例 https://i.loli.net/2020/11/24/2TWwhqMQGSrvPEz.jpg |
|
21
HiCode 2020-11-25 04:57:05 +08:00
@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'"来控制跳转到不同的页面。 |
|
22
TmacV2 OP 例如 menu 组件里标签栏有四个导航标签 ，我就做四个 view 组件，每个组件都引用 menu 组件 。在这些 view 组件各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值吗
那会产生 4 个 menu 组件实例 好像也不对。 第一次做前端项目 提问有点幼稚 请见谅哟 |
|
23
TmacV2 OP @HiCode 例如 menu 组件里标签栏有四个导航标签 ，我就做四个 view 组件，每个组件都引用 menu 组件 。在这些 view 组件各个页面 mounted 事件中通过 store.set_menu_active 函数修改 menu_active 的值吗 那会产生 4 个 menu 组件实例 好像也不对。第一次做前端项目 提问有点幼稚 请见谅哟
|
|
24
HiCode 2020-11-25 18:17:39 +08:00
@TmacV2 你的理解没有错，确实会存在 4 个 menu 的实例。我最近打算搞 PC 后台类的系统页面，会增加 layout 的功能。
|
|
26
TmacV2 OP @HiCode 大佬 有没有基于 vue 的 demo 给我学习学习 前端知识点也挺多的 想快点上手
|
|
27
HiCode 2020-11-26 00:27:04 +08:00
@TmacV2 我自己的学习路径是看各个 vue ui 框架的代码和他们的实现，参考学习他们的思路，例如
https://github.com/heyui/heyui https://github.com/heyui/heyui-admin 成长比较大还是要靠实际项目，一般我先设定自己想要做什么东西，然后这个东西有哪些项目可以参考，就去看他们思路，然后对着抄一份作业。哈哈哈哈哈哈，所以实在谈不上是大佬。 我其实是 PHP 后端来的，不过现在也准备用 deno，全面改 js 了。 |
|
30
HiCode 2021-02-24 14:15:33 +08:00
@TmacV2 谢谢支持，嗯……我春节撸了一个新的，https://gitee.com/haimadongli001/vue-web-loader
这个可以直接支持 vue-router，并且可以通过 kbone 编译成小程序。 当然，为了保证兼容性 vue 组件里面还是要按 es5 的格式去写，用 es6+部分浏览器会不兼容。 哈哈哈哈哈，谢谢支持！ |
|
31
TmacV2 OP @HiCode 老哥，你 https://gitee.com/haimadongli001/vue-web-loader 这个项目能开放给我 fork 一下吗？ 找不到了
|
Select Language