老 web 项目加几个页面 打算用用现代前端框架

2020-11-22 09:44:29 +08:00
 azev

不想用那种前端工程项目编译发布的方式了
就用了 cdn 脚本 试下来发现貌似 vue 比 react 更适合我这个情形?
因为 vue 的话 引入脚本后 添加组件 直接在 html 内容里加标签元素就行了
而 react 添加组件的方式是得用脚本组装添加 相对要麻烦些
是不是这样?还是我没找到更好的方法?

2506 次点击
所在节点    问与答
23 条回复
TmacV2
2020-11-22 10:04:06 +08:00
组件能复用吗
aaronlam
2020-11-22 10:42:57 +08:00
react 中最引以为傲的 jsx 需要使用 babel 来进行转译的,如果采用直接引入不是说不可以,但是没就了 jsx 这种语法糖了。
vue 可以无缝的直接引入的原因是,因为他的写法就趋向于原生 JS 的写法,而且你通过直接引入的方式使用了组件库,不出意外你应该是全量引入了组件库。而如果你是采用前端工程编译形式的话,是可以进行按需引入的。
gouflv
2020-11-22 10:47:10 +08:00
vue 当 jquery 用挺好的
SergeGao
2020-11-22 11:27:46 +08:00
不用 webpack 来写 vue 完全没那味了...试下 vue cli 吧,容易上手的
azev
2020-11-22 11:32:06 +08:00
@aaronlam 是的 vue 应该是全量引入了
react 的情况是即便不是用 jsx 也是用脚本引入组件 相对 vue 要麻烦点
看官方示例是这样
https://gist.github.com/gaearon/6668a1f6986742109c00a581ce704605
aaronlam
2020-11-22 12:01:23 +08:00
@azev 是的,我个人认为 react 从诞生的那一刻起就是为了颠覆以往写前端的方式,配合起一系列工具来完成 SPA 的编码。而 vue 的话,更多是为了能够让以前使用 jQuery 或者是说刚接触前端的人能无缝的使用上,所以就在设计之初就尽量把 API 还有写法都趋向于原生 JS 的方式,所以 vue 可以在某些情况下直接替代 jQuery,把 vue 直接引入当 jQuery 来用。

是的,react 直接引入的确是比 vue 麻烦不少,而且正常来说也很少有人会这样使用,毕竟使都用上了 react 就是要品尝前端工具链带来的开发效率红利。但是实在要这样使用的话,都会直接选择 vue 来这样使用,vue 也强调了自己是渐进式的构建用户界面的框架,所谓的渐进式也在这一方面有所体现吧。
aaronlam
2020-11-22 12:03:44 +08:00
@azev 简单的来说就是 react 从设计之初就没有考虑,如何让你直接引入使用的时候会比较方便。
charlie21
2020-11-22 12:41:38 +08:00
你说用 vue 你说用 react,若你离职了有人接手吗?
跟你们公司内部商量去
azev
2020-11-22 14:17:57 +08:00
@aaronlam 多谢
azcvcza
2020-11-22 16:08:57 +08:00
react 的话,你直接写 render 到 document 上也行,不过不如 vue 直接挂个文件就开写来得快
murmur
2020-11-22 16:10:22 +08:00
vue 直接挂包在 html 里写 template
TmacV2
2020-11-22 16:22:10 +08:00
@gouflv 那不是每个页面都要实例化一个 vue 对象吗 (新手不懂就问
murmur
2020-11-22 16:23:23 +08:00
@TmacV2 你停留在这个阶段就不要带入面向对象的东西,一个 vue 对象跟一个 jquery 对象对你有什么区别么,我们有的项目直接用空的 vue 对象做事件总线,对于 vue 最简单的形式,他就是一个高级模板带双向绑定,外加规范你一些东西应该写到哪里
gouflv
2020-11-22 16:29:24 +08:00
@TmacV2 每个页面的模块和组件都是 vue 对象的嵌套,跟是不是多页无关
TmacV2
2020-11-22 18:31:43 +08:00
@gouflv 你说的对,然后还想问一下 以前写 vue 单组件文件 然后可以 import 导入使用 那 cdn 方式构建的 vue 项目应该怎么做能达到同样的效果呢
TmacV2
2020-11-22 18:42:48 +08:00
@murmur 以前写 vue 单组件文件 然后可以 import 导入使用 那 cdn 方式构建的 vue 项目应该怎么做能达到同样的效果呢
muzuiget
2020-11-22 20:46:26 +08:00
React 也可以直接用啊,不需要 JSX,JSX 不过是个语法糖。
gouflv
2020-11-22 20:59:47 +08:00
@TmacV2 参考 jq plugin 的引入方式,只不过 vue 里面是走 Vue.component 注册
suzic
2020-11-22 21:18:14 +08:00
这种项目 vue 的确是最合适的,我也写过不少。组件复用的话,把.vue 的单文件稍微改一下就能做到了
aaronlam
2020-11-22 21:25:50 +08:00
@gouflv 在我认知里 vue 单文件,貌似在构建工具中是需要用 vue 的 loader 来进行特殊处理 template, script, style 三个部分的,直接的 vue 单文件应该是不能以 script 标签的形式挂载到页面使用的把?还是说有类似于早期的 babel 实时解析的 JS 库对其进行解析?我也不是很确定,所以想请指导一下。

另外我看一般支持直接以 script 标签的形式挂载的 UI 组件库,但是经过构建工具打包后的全量包,所以还是对 vue 单文件可以以 script 的引入表示怀疑的态度。。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/727975

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX