微信小程序的自定义组件

一、创建自定义组件

(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.mzph.cn/bicheng/13226.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

.gitignore文件使用指南

.gitignore文件使用指南 .gitignore 文件的作用 忽略不需要的文件&#xff1a;避免将不必要的文件&#xff08;如编译生成的文件、临时文件、日志文件等&#xff09;提交到代码仓库。保护敏感信息&#xff1a;防止本地配置文件&#xff08;如数据库配置文件、API 密钥等&…

阅读笔记——《代码整洁之道》ch2

引言 clean-code ch2阅读笔记 有意义的命名 名副其实 选择体现本意的名称能让人更容易理解和修改代码。 避免误导 怎么能知道该调用哪个函数呢? getActiveAccount(); getActiveAccounts(); getActiveAccountInfo();moneyAmount与money没区别,customerInfo与customer没区别。…

代码随想录-算法训练营day39【动态规划02:不同路径】

代码随想录-035期-算法训练营【博客笔记汇总表】-CSDN博客 第九章 动态规划part02● 62.不同路径 ● 63. 不同路径 II 今天开始逐渐有 dp的感觉了&#xff0c;题目不多&#xff0c;就两个 不同路径&#xff0c;可以好好研究一下详细布置 62.不同路径 本题大家掌握动态规划的方…

Elasticsearch 搜索引擎实现对文档内容进行快速检索(保姆级教程)

本文主要讲解ES如何从提取文档中提取内容&#xff08;word、pdf、txt、excel等文件类型&#xff09;&#xff0c;实现快速检索文档内容实现。 特别说明一下&#xff0c;为什么用7.10.0版本&#xff0c;因为在项目中除了精确匹配的要求&#xff0c;也会有模糊查询&#xff08;关…

Android 异常开机半屏重启代码分析

Android 的稳定性是 Android 性能的一个重要指标&#xff0c;它也是 App 质量构建体系中最基本和最关键的一环&#xff1b;如果应用经常崩溃&#xff0c;或者关键功能不可用&#xff0c;那显然会对我们的留存产生重大影响所以为了保障应用的稳定性&#xff0c;我们首先应该树立…

在vue3+typescript中使用d3 version 7注意的地方

前几天在做一个前端项目&#xff0c;需要在一个vue3typescript的项目中使用d3 上次做vue2d3v5的项目已经很多年了&#xff0c;这次不仅是vue3&#xff0c;用的typescript&#xff0c;而且d3也升级到v7了&#xff0c;有很多东西不一样了。 这里记录一下&#xff0c;避免日后忘…

go-Expect-实验

实验脚本程序 test.sh read -p "Would you like to rejoin it to the cluster? [y/N]:" v echo if [ "$v" "y" ];thenecho "$(date %s)shark A" >> ./test.log fi read -p "Would you like to rejoin it to the cluste…

JDK14和JDK1.14相同吗?

关于Java开发工具包&#xff08;JDK&#xff09;的命名&#xff0c;我们可以从Java版本的发展历史来详细解析其命名规则。 在Java的早期版本中&#xff0c;JDK的版本号使用了“1.x”的格式&#xff0c;其中“x”是版本号&#xff0c;如JDK 1.0、JDK 1.1、JDK 1.2等。然而&…

Zynq UltraScale+ RFSoC 配置存储器器件

Zynq UltraScale RFSoC 配置存储器器件 下表所示闪存器件支持通过 Vivado 软件对 Zynq UltraScale RFSoC 器件执行擦除、空白检查、编程和验证等配置操 作。 本附录中的表格所列赛灵思系列非易失性存储器将不断保持更新 &#xff0c; 并支持通过 Vivado 软件对其中所列…

【C语言】6.C语言VS实用调试技巧(2)

文章目录 6.调试举例17.调试举例28.调试举例3&#xff1a;数组9.编程常⻅错误归类9.1 编译型错误9.2 链接型错误9.3 运⾏时错误 – 6.调试举例1 求 1!2!3!4!…10! 的和。 int main() {int n 0;int i 0;int ret 1;int sum 0;for (n 1; n < 3; n) {for (i 1; i < …

knife4j案例

1.导入 <dependency><groupId>com.github.xiaoymin</groupId><artifactId>knife4j-spring-boot-starter</artifactId> </dependency>2.在配置类中加入 knife4j 相关配置并设置静态资源映射&#xff08;否则接口文档页面无法访问&#xff…

就这?轻轻松松在RK356X Android11适配ML307R Cat.1模组

开源鸿蒙硬件方案领跑者 触觉智能 Industio 本文基于IDO-SXB3568主板&#xff0c;介绍Android11平台上适配中移物联ML307R Cat.1 4G模组的方法。该方法适用于触觉所有RK356X的主板。 IDO-SXB3568是触觉智能推出的RK3568行业主板&#xff0c;预计6月上旬正式上架售卖。该行业主…

CCF PTA 2022年11月C++大富翁游戏

【问题描述】 小明很喜欢玩大富翁游戏&#xff0c;这个游戏的规则如下&#xff1a; 1、游戏地图是有 N 个格子&#xff0c;分别编号从 1 到 N。玩家一开始位于 1 号格子。 2、地图的每个格子上都有事件&#xff0c;事件有以下两种类型&#xff1a; A&#xff09;罚款 x 枚金币…

使用Locust进行性能测试:快速指南与Python代码示例

性能测试是确保应用能够在预期负载下正常运行的关键步骤。在各种性能测试工具中&#xff0c;Locust以其轻量级、易用性以及可扩展性脱颖而出。它是一个用Python编写的开源性能测试工具&#xff0c;不仅能够模拟数以万计的用户对网站或应用程序进行压力测试&#xff0c;还允许测…

鸿蒙OS开发:【一次开发,多端部署】(应用UX设计原则)

应用UX设计原则 设计原则 当为多种不同的设备开发应用时&#xff0c;有如下设计原则&#xff1a; 差异性 充分了解所要支持的设备&#xff0c;包括屏幕尺寸、交互方式、使用场景、用户人群等&#xff0c;对设备的特性进行针对性的设计。 一致性 除了要考虑每个设备的特性…

shell脚本基础(简单if结构)

简单if结构 简单的if结构是&#xff1a; if expression then command command … fi 在使用这种简单if结构时&#xff0c;要特别注意测试条件后如果没有“&#xff1b;”&#xff0c;则then语句要换行&#xff0c;否则会产生不必要的错误。如果if和then可以处于同一行&#xff…

54.指针

目录 一.什么是指针&#xff1f; 二&#xff0e;定义一个指针变量 三&#xff0e;指针变量类型 四&#xff0e;取地址运算符& 五.取值运算符* 六.视频教程 一.什么是指针&#xff1f; 口语中的指针一般指指针变量&#xff0c;指针变量存放的是一个地址。普通变量存放…

电脑缺失api-ms-win-crt-runtime-l1-1-0.dll文件的几种修复方法

当您在使用电脑过程中遇到程序启动失败&#xff0c;提示缺少“api-ms-win-crt-runtime-l1-1-0.dll”文件时&#xff0c;不必过于焦虑&#xff0c;此问题通常与Windows系统的Visual C Redistributable组件未正确安装或损坏有关。小编将介绍5种修复电脑缺失api-ms-win-crt-runtim…

计算机毕业设计 | vue+springboot电影票售卖 影院售票商城 电影管理系统(附源码+论文)

1&#xff0c;项目背景 目的&#xff1a;本课题主要目标是设计并能够实现一个基于web网页的电影院购票选座系统&#xff0c;整个网站项目使用了B/S架构&#xff0c;基于vue和SpringBoot框架下开发&#xff1b;管理员通过后台管理系统实现管理影院信息&#xff0c;电影信息&…

[OpenGL] 点光源阴影(万向阴影贴图)

本章节源码 点击此处 文档持续更新 一 为什么采用点透视投影 透视投影: 由于点光源是一个点向四周发散的光线,所以这将导致点光源会以不同的角度到达场景中的不同表面&#xff0c;造成近大远小的效果,所以要采用透视投影矩阵来处理点光源的阴影,透视投影能够正确反映这种随着…