欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 健康 > 养生 > 【微信小程序_19_自定义组件(1)】

【微信小程序_19_自定义组件(1)】

2024/10/23 23:22:59 来源:https://blog.csdn.net/weixin_46549923/article/details/143058598  浏览:    关键词:【微信小程序_19_自定义组件(1)】

摘要:本文主要介绍了小程序开发中自定义组件的相关知识。包括组件的创建与引用,可在项目根目录创建组件文件夹,生成相应文件,并根据使用频率选择全局或局部引用。还阐述了组件和页面的区别,如组件的.json 文件需声明 “component: true”,.js 文件调用 Component () 函数等。在样式方面,组件默认样式隔离,能防止内外样式干扰,同时指出了样式隔离的注意点和修改选项,可选值包括 isolated、apply-shared 和 shared。通过这些知识,能更好地进行小程序的开发,提高代码的复用性和可维护性。

微信小程序_19_自定义组件(1)

  • 1.自定义组件相关概念
    • 创建与引用
    • 区别与选择
  • 2.组件和页面的区别
    • 文件组成
    • 文件特点
  • 3.组件样式相关
    • 样式隔离
    • 修改样式隔离选项

1.自定义组件相关概念

创建与引用

  • 创建:在项目根目录中,右键创建components文件夹,在新建的文件夹中右键新建组件,会自动生成.js、.json、.wxml和.wxss四个文件。不同组件应存放在单独目录中。
  • 引用
  • 局部引用:在页面的.json配置文件中,通过"usingComponents"字段引入组件,如"my-test1":"/components/test1/test1",然后在.wxml文件中使用<my-test1></my-test1>
  • 全局引用:在app.json全局配置文件中引入组件,如"my-test2": "/components/test2/test2",在页面的.wxml文件中也可使用。

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com