当前位置: 首页 > news >正文

微信小程序的自定义组件

一、创建自定义组件

(1)定义:

把页面重复的代码部分封装成为一个自定义组件,以便在不同的页面中重复使用,有助于代码的维护。

(2)组成:

自定义组件的组成:json文件,js文件,wxml文件,wxss文件

(也就是配置,逻辑,结构,样式)

(3)使用:

在components文件夹下新建一个文件夹,命名为test。test文件夹下新建component。然后自定义命名为test敲回车

(4)此时,test.js里面会出现如下属性。

data属性,可读可写,更倾向于储存组件的私有数据

properties属性,可读可写,更倾向于存储外界传递的公有数据

(5)在test.wxml里面写好自定义组件封装的内容:

<view>我是自定义组件test</view>

二、使用自定义组件

(1)使用前提:

在页面的json文件或app.json里修改全局配置

自定义组件的引用方式:

局部引用:在页面的json文件中引用自定义组件

全局引用:在app.json全局配置文件中引用自定义组件

(2)使用:

在app.json里面:

然后直接在pages下的index.wxml引用自定义组件test 

(3)效果如图所示:

http://www.lryc.cn/news/351725.html

相关文章:

  • 【算法刷题day57】Leetcode:739. 每日温度、496.下一个更大元素 I
  • 【EXCEL_VBA_实战】两组数据比对是否一致(字符串数组)
  • 寻找峰值 ---- 二分查找
  • C语言--输入一个整数代表秒数,将这个数转化为对应的小时数、分钟数、和秒数
  • 二分搜索技术
  • docker容器安装nexus3以及nexus3备份迁移仓库数据
  • 无线领夹麦克风哪个品牌音质最好,揭秘无线领夹麦哪个牌子好用
  • pcd点云江湖之处处碰壁:点云文件pcd加载02
  • 【SQL国际标准】ISO/IEC 9075:2023 系列SQL的国际标准详情
  • 15.1数组练习题
  • Flink 任务调度策略:Lazy from Sources 深入解析
  • 【NumPy】关于numpy.reshape()函数,看这一篇文章就够了
  • 探寻最强性能云电脑:ToDesk云电脑、无影云、网易云游戏、易腾云横测大比拼
  • 回溯法——(2)n皇后问题(C语言讲解)(LeetCode51 N皇后思想)(4皇后棋盘画图举例)(附代码)
  • 数据库系统概论(第5版)复习笔记
  • 数仓领域,Serving 是什么概念?
  • Python筑基之旅-MySQL数据库(三)
  • (全面)Nginx格式化插件,Nginx生产工具,Nginx常用命令
  • 软考 软件设计师 场景分析题 速成篇
  • [学习笔记](Python3)防止SQL注入、XSS攻击和文件上传漏洞
  • 西门子CPU与汇川伺服通信与控制
  • 移动硬盘无法读取怎么修复?简单八步,轻松搞定!
  • c4d云渲染是工程文件会暴露吗?
  • C语言/数据结构——每日一题(有效的括号)
  • STM32使用旋转编码开关
  • OneMO同行 心级服务:中移物联OneMO模组助力客户终端寒冷环境下的稳定运行
  • 爬虫视图展示之 Power BI
  • 微软刚发布的Copilot+PC为什么让Intel和AMD尴尬?2024 AI PC元年——产业布局及前景展望
  • 抖音视频怎么去水印保存部分源码|短视频爬虫提取收集下载工具
  • 类的组合、作用域与可见性、类的静态成员、单例模式、