vue 前端组件化拆分原则(个人总结,非官方)

详尽可转前端组件拆分思路及通信设计(vue2.0)-组件拆分原则-vue组件-vue组件拆分原则

一.公共功能点

例:页头,侧边栏,底部

二.可复用组件

例:购物车卡片等一样样式的地方

三.独立逻辑点

例:弹窗内部的表单,tab页,单个select的远程搜索,页面上中下多层结构拆分多个组件等
如果对性能有要求需考虑

四.代码数目过500行

一般来说不会这么多代码,可以考虑拆分

五.常量配置

建议扔独立js文件
例:echart的option部分数据,表单rules

六.全局配置类

例:常量池,混入mixin池,枚举池

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
Vue组件开发是一种将页面拆分成独立、可复用的组件的开发方式。下面是Vue组件开发的一般过程: 1. 创建组件:首先,你需要创建一个Vue组件。一个Vue组件通常由模板、脚本和样式组成。模板定义了组件的结构和布局,脚本定义了组件的行为和数据,样式定义了组件的外观。 2. 注册组件:在使用组件之前,你需要将其注册到Vue实例中。可以通过全局注册或局部注册的方式来注册组件。全局注册可以在任何地方使用该组件,而局部注册只能在特定的Vue实例中使用。 3. 使用组件:注册完成后,你可以在模板中使用该组件。通过在模板中使用组件的标签,就可以将该组件渲染到页面上。 4. 传递数据:在使用组件时,你可以通过props属性向组件传递数据。props属性允许父组件向子组件传递数据,并且子组件可以在脚本中使用这些数据。 5. 监听事件:除了传递数据,你还可以在子组件中触发事件,并在父组件中监听这些事件。通过自定义事件,可以实现子组件与父组件之间的通信。 6. 组件间通信:有时候,你可能需要在不相关的组件之间进行通信。Vue提供了多种方式来实现组件间的通信,如使用事件总线、Vuex状态管理等。 7. 组件复用:组件开发的一个重要优势是组件的复用性。你可以在不同的项目中重复使用已经创建好的组件,提高开发效率。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

_默_

别打赏了,点点赞,点点关注就行

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值