微信小程序之自定义组件及使用

1、创建自定义组件文件夹与文件:

创建一个名为custom-dialog的自定义组件,位于components下,创建自定义弹窗组件文件夹结构如下:

写好自定义组件的结构文件.wxml、样式文件wxss、逻辑文件.js。

2、组件注册:

该组件(本例子指CustomDialog 组件)的文件夹内含有一个有效的 .json 文件,且该文件中正确指定了组件的名称,例如:

3、在页面中使用自定义组件

3.1导入并使用组件:

在需要使用此组件的页面的wxml文件中,本例子是在需要用到弹窗的页面index页面中引入并使用该组件:

3.2确认组件引入

确保已在使用 <custom-dialog> 的页面中正确引入了该组件,例如在页面的 json 文件中添加组件路径:

这时你的组件就定义好并可以使用了!

相关推荐
说私域2 小时前
社群时代下的商业变革:“开源AI智能名片链动2+1模式S2B2C商城小程序”的应用与影响
人工智能·小程序·开源
毕设源码-朱学姐4 小时前
【开题答辩全过程】以 基于Java的医务室病历管理小程序为例,包含答辩的问题和答案
java·开发语言·小程序
文人sec4 小时前
微信小程序minium自动化测试SOP
微信小程序·小程序
克里斯蒂亚诺更新4 小时前
微信小程序 点击地图后弹出一个模态框
微信小程序·小程序·notepad++
云起SAAS4 小时前
患者随访管理抖音快手微信小程序看广告流量主开源
微信小程序·小程序·ai编程·看广告变现轻·患者随访管理
2501_916008894 小时前
HTTPS 请求抓包,从原理到落地排查的工程化指南(Charles / tcpdump / Wireshark / Sniffmaster)
ios·小程序·https·uni-app·wireshark·iphone·tcpdump
金梦人生5 小时前
UniApp + Vue3 + TS 工程化实战笔记
前端·微信小程序
2501_9159090617 小时前
WebView 调试工具全解析,解决“看不见的移动端问题”
android·ios·小程序·https·uni-app·iphone·webview
说私域19 小时前
“开源链动2+1模式AI智能名片S2B2C商城小程序”在拉群营销中的应用与效果
人工智能·小程序
2501_9151063219 小时前
App 怎么上架 iOS?从准备资料到开心上架(Appuploader)免 Mac 上传的完整实战流程指南
android·macos·ios·小程序·uni-app·iphone·webview