Uni-app是基于VUE开发的。通常，首先安装组件，然后在全局或本地引入和注册。今天给大家分享一下在easycom模式下开发UNI-APP组件调用必须掌握的实用技巧。需要朋友就来看看吧。
这篇文章的目的是为了引起更多的注意。具体文档和easycom规范请移至uni-app官网。[portal]easycom模式描述
easycom组件模式介绍
从HBuilderX 2.5.5开始支持Easycom组件模式。如果HBuiderX版本较低，请先检查更新！
Uni-app是基于VUE开发的。通常，首先安装组件，然后在全球或本地引入和注册。然后，您可以使用页面中相应的组件。流程比较复杂，uni-app通过使用easycom组件模式简化了上述三个步骤，使得用户在使用组件时无需参考和注册，直接在页面中使用组件。当然，前提是遵循某些easycom规范。
实际使用效果如下：
模板
视图class='container '
单一列表
单一列表项标题='第一行'/单一列表项
单一列表项标题='第二行'/单一列表项
/uni-list
/查看
/模板
脚本
//这里不需要导入，也不需要在组件中注册uni-list组件。模板可以直接使用。
导出默认值{
data() {
返回{
}
}
}
/脚本
uni-app 默认的easycom规范
要像上面的代码块一样直接在页面中使用组件，在安装或定制组件时需要遵循以下规范：
组件文件必须放在组件目录中。
的。组件对应的vue文件必须放在与组件同名的文件目录中。
描述可能不是很清楚，看看效果图就知道了：
以图中的uni-swipe-action.vue组件为例，其组件路径必须是components/uni-swipe-action/uni-swipe-action . vue。
自定义组件放置目录
Uni-app的默认easycom规范是将组件放在组件目录中。
Uni-app还允许我们修改组件放置的默认目录和匹配规则；
Easycom是自动开启的，不需要手动开启。需要时，可以在pages.json的easycom例程中进行个性化设置，比如关闭自动扫描，或者自定义扫描匹配组件的策略。设置参数如下：
请参考以下官方自定义配置规则：
[匹配node_modules中的vue文件]
easycom ':
' autoscan': true，
自定义':{
Uni-(。*)':' @/components/uni-$ 1.vue '，//匹配组件目录中的vue文件。
Vue-file-(。*)':'包名/路径/到/vue-file-$ 1 . vue '//匹配node_modules中的vue文件。
}
}
UVIew配置规则如下：
[在uview/components目录中匹配以u开头的u view/components]
{
//这是要添加的内容。
easycom ':
'^u-(.*)':' @/u view/components/u-$ 1/u-$ 1 . vue '
},
//这是现有的内容。
pages': [
//.
]
}
使用easycom的好处
简化组件的使用，提高开发效率。
无论组件目录中安装了多少组件，easycom都会在打包后自动移除未使用的组件，对组件库的使用特别友好。
关于在easycom模式下开发UNI-APP组件调用必须掌握的实用技巧，本文到此结束。有关easycom模式下UNI-APP组件的更多信息，请搜索我们以前的文章或继续浏览下面的相关文章。希望大家以后能多多支持我们！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。