小程序properties默认值定义及父子组件的传值

news2024/11/25 2:31:31
因经常写vue,很久没写小程序,容易串频道,现记录一下小程序的组件用法、监听传入值及父子传值方式

首先小程序中传值是没有:(冒号)的,其次properties中定义默认值不需要写default

1.自定义组件中,首先json文件需要component:true
在这里插入图片描述

2.父组件使用时在json中引入:
在这里插入图片描述

父组件中的.js中定义变量:
在这里插入图片描述
父组件.wxml中引入组件:
在这里插入图片描述

<common-area bindchangeLoading="changeLoading" bindgetadd="getLocalCity" bindclose='goback' list="{{treeData}}" defArr="{{defArr}}" values="{{values}}" bindgetText="getText" id="common-area"></common-area>

3.子组件properties接收值,并设默认值
在这里插入图片描述

4.想像vue中watch监听父组件值发生变化,我们可以用observers,需要注意的是他只有父组件传入值,并不保留原有值,所以只有newValue
在这里插入图片描述
5.子组件向父组件传值:triggerEvent(‘事件名’, ‘值’)(注意components方法需要写在methods里)
在这里插入图片描述
父组件接收,只需用bind+子组件抛出的事件名,即bindclose即可:
在这里插入图片描述
获取子组件值的方法:

goback({detail}){ 
	console.log(detail) // detail输出值即为子组件抛出值
}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1689733.html

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

相关文章

TransFormer学习之基础知识:STN、SENet、CBAM、Self-Attention

1.空间注意力机制STN 参考链接&#xff1a;STN(Spatial Transformer Networks) 参考链接&#xff1a;通俗易懂的Spatial Transformer Networks(STN) 核心动机&#xff1a; 在空间中捕获重要区域特征(如图像中的数字)&#xff0c;将核心区域进行放大居中&#xff0c;使得结果更…

2461. 长度为 K 子数组中的最大和(c++)

给你一个整数数组 nums 和一个整数 k 。请你从 nums 中满足下述条件的全部子数组中找出最大子数组和&#xff1a; 子数组的长度是 k&#xff0c;且子数组中的所有元素 各不相同 。 返回满足题面要求的最大子数组和。如果不存在子数组满足这些条件&#xff0c;返回 0 。 子数…

第七节 ConfigurationClassParser 源码分析

tips&#xff1a; ConfigurationClassParser 是 Springframework 中的重要类。 本章主要是源码理解&#xff0c;有难度和深度&#xff0c;也枯燥乏味&#xff0c;可以根据实际情况选择阅读。 位置&#xff1a;org.springframework.context.annotation.ConfigurationClassPars…

怎样下载Android Studio历史版本文件包

1.在官网上下载都是推荐最新版本&#xff0c;想下载历史版本比较费劲&#xff0c;绕来绕去的。 2.进入这个网站可以下载其他版本https://android-studio.en.uptodown.com/windows/versions Older versions of Android Studio Its not uncommon for the latest version of an a…

【大数据】MapReduce实战

文章目录 [toc]Word CountMapperReducerrun.sh本地调试 基于白名单的Word CountMapperReducerrun.sh本地调试 文件分发-fileMapperReducerrun.sh -cacheFileMapperReducerrun.sh -cacheArchiveMapperReducerrun.sh 杀死MapReduce Job排序压缩文件mr_ip_lib_python本地调试 个人…

Flask Response 对象

文章目录 创建 Response 对象设置响应内容设置响应状态码设置响应头完整的示例拓展设置响应的 cookie重定向响应发送文件作为响应 总结 Flask 是一个 Python Web 框架&#xff0c;用于快速开发 Web 应用程序。在 Flask 中&#xff0c;我们使用 Response 对象来构建 HTTP 响应。…

东软联合福建省大数据集团打造“数据要素×医疗健康”服务新模式

5月23日&#xff0c;东软集团与福建省大数据集团有限公司在福州签订战略合作协议。 据「TMT星球」了解&#xff0c;双方将在健康医疗数据要素价值领域展开合作&#xff0c;通过大数据服务&#xff0c;赋能商业保险公司的产品设计和保险两核&#xff0c;打造“数据要素医疗健康…

微软开源多模态大模型Phi-3-vision,微调实战来了

节前&#xff0c;我们组织了一场算法岗技术&面试讨论会&#xff0c;邀请了一些互联网大厂朋友、今年参加社招和校招面试的同学。 针对大模型& AIGC 技术趋势、大模型& AIGC 落地项目经验分享、新手如何入门算法岗、该如何准备面试攻略、面试常考点等热门话题进行了…

Qt 报错总结 No suitable kits found

目录 “No suitable kits found” 解决 解决方法参考&#xff1a; chatGPT辅助解决QT构建报错error: multiple target patterns 我的解决方法&#xff1a;把语言设置为空 “No suitable kits found” 解决 没有找到合适的kits套件&#xff0c;在安装Qt Creator时没有安装Min…

AGI技术与原理浅析:曙光还是迷失?

前言&#xff1a;回顾以往博客文章&#xff0c;最近一次更新在2020-07&#xff0c;内容以机器学习、深度学习、CV、Slam为主&#xff0c;顺带夹杂个人感悟。笔者并非算法科班出身&#xff0c;本科学制药、研究生学金融&#xff0c;最原始的算法积累都来源于网络&#xff0c;当时…

系统架构师考试(十)

SaaS为在线客服 PaaS为二次开发&#xff0c;比如低代码平台 IaaS 硬件开发 B 是基础设施作为服务 软件架构的概念 架构风格 数据流风格 网络报文是在计算机网络中通过网络传输的数据单元&#xff0c;它是网络通信的基本单位。网络报文包含了发送方和接收方之间传输的数据&…

【Crypto】摩丝

文章目录 一、摩斯解题感悟 一、摩斯 很明显莫尔斯密码 iloveyou还挺浪漫 小小flag&#xff0c;拿下 解题感悟 莫尔斯密码这种题还是比较明显的

在Windows10中重命名文件和文件夹的6种方法,有你熟悉和不熟悉的

序言 你可以通过多种方式在Windows 10上重命名文件。如果每次你想更改文件名时仍右键单击并选择“重命名”,那么我们有一些技巧可以加快更改速度。 使用文件资源管理器重命名文件和文件夹 Windows 10的文件资源管理器是一个功能强大的工具。你知道吗,有四种不同的方法可以…

从零入门激光SLAM(二十一)——看不懂FAST-LIO?进来

大家好呀&#xff0c;我是一个SLAM方向的在读博士&#xff0c;深知SLAM学习过程一路走来的坎坷&#xff0c;也十分感谢各位大佬的优质文章和源码。随着知识的越来越多&#xff0c;越来越细&#xff0c;我准备整理一个自己的激光SLAM学习笔记专栏&#xff0c;从0带大家快速上手激…

【Vue】input框自动聚焦且输入验证码后跳至下一位

场景:PC端 样式: <div class="verification-code-input"><input v-model="code[index]" v-for="(_, index) in 5" :key="index" type="text" maxlength="1" @input="handleInput(index)" …

数据库—— MySQL数据库安装

一、MySQL数据库定义 MySQL是一种开源关系型数据库管理系统&#xff0c;它使用SQL语言进行数据的管理。通过MySQL&#xff0c;可以创建数据库、表格、插入、查询、更新和删除数据等操作。MySQL支持多种操作系统&#xff0c;并且被广泛应用于Web应用程序开发中。MySQL以其高性能…

【HTML】制作一个跟随鼠标的流畅线条引导页界面(可直接复制源码)

目录 前言 HTML部分 CSS部分 JS部分 效果图 总结 前言 无需多言&#xff0c;本文将详细介绍一段HTML代码&#xff0c;图中线条可跟随鼠标移动&#xff0c;具体内容如下&#xff1a; 开始 首先新建一个HTML的文本&#xff0c;文本名改为[index.html]&#xff0c;创建好后右…

(Oracle)SQL优化基础(三):看懂执行计划顺序

往期内容&#xff1a; &#xff08;Oracle&#xff09;SQL优化基础&#xff08;一&#xff09;&#xff1a;获取执行计划 &#xff08;Oracle&#xff09;SQL优化基础&#xff08;二&#xff09;&#xff1a;统计信息 获取到执行计划后&#xff0c;对于新手朋友来讲可能不知道…

win11安装docker运行Open-Webui 界面化展示 ollama大模型

1.OpenWeb UI运行需要docker 环境下载docker Get Started | Docker 2.需要命令提示符docker -v 查询是否安装成功&#xff1b; 查询docker详情docker version 3.github拉取open-webUi镜像Package open-webui GitHub 复制命令运行在命令提示符&#xff1b; 等待下载完成 4.到…

[图解]SysML和EA建模住宅安全系统-07 to be块定义图

1 00:00:01,970 --> 00:00:05,040 入侵者这里有个∞ 2 00:00:05,530 --> 00:00:07,000 说明它下面已经有子图了 3 00:00:07,010 --> 00:00:08,080 我们看看里面子图 4 00:00:10,200 --> 00:00:17,000 这里&#xff0c;我们看位置 5 00:00:19,030 --> 00:00:…