微信小程序组件传值

虽然微信小程序是比较轻量的,但是还是拥有组件的 

这是文件的基本目录

我们的代码基本都在pages和components文件夹中

在component中创建组件

  在component中 ,创建一个目录 我创建了一个 head目录 用于配置头部信息  我在这里创建了

 一个头部组件,head  创建的方式就是 右击鼠标 选择新建 Component  完成可以大概是这样的

   

 我们先试一下看看这个组件能不能使用,之后进行组件传值的一些配置

  点开page 下自带的index 点击 index.json文件

  

{
  "usingComponents": {
    "Componnent":"../../components/Head/head"
  }
}

   在index.json中加入这样的配置  键 Component是组件的名称  细心的朋友可以发现其中的值是这个组件的相对路径 

在 index.wxml中使用这个组件 

<Componnent></Componnent>

在 index.wxml 中 定义自定义属性 传递  数据

<Componnent label="我是传递的数据"></Componnent>

在head.js中的properties中 加入以下代码     

    label:{
      type:String,
      value:''
    }

    属性的名字 及刚刚父组件的自定义属性   type就行类型 value 是默认的值

在子组件中 直接引入自己的值

<text>我是子组件
{{ label}}
</text>

   这样就可以继续数据的传递了

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Vue基础知识:异步DOM更新是什么?$nextTick是什么?到底应该如何使用。什么是同步?什么是异步?

要先了解异步dom更新是什么就必须先了解&#xff0c;什么是同步&#xff1f;什么是异步&#xff1f; 1.什么是同步&#xff1f;什么是异步&#xff1f; 同步&#xff08;Synchronous&#xff09;&#xff1a; 同步操作是按照代码的顺序执行的&#xff0c;每个操作都必须等待上…

NiceGUI:让Python变身为Web应用开发大师的神器

简介 NiceGUI是一个易于使用的基于Python的UI框架&#xff0c;可以在您的Web浏览器中使用。您可以创建按钮、对话框、Markdown、3D场景、图表等等。 NiceGUI开源支持较好&#xff0c;代码更新频率较高&#xff0c;目前已经更新至: V1.4.26。 适用场景 NiceGUI非常适用于各种…

为什么 JavaScript 在国外逐渐用于前端+后端开发

这个问题其实没人能给出可证伪的结论&#xff0c;那不如干脆给一个感性的答案: 因为阿里“不争气”。 确切的说&#xff0c;因为阿里的nodejs团队没卷赢&#xff0c;至少暂时还没卷赢&#xff0c;没拿到真正有价值的业务场景&#xff0c;做出真正有说服力的案例项目。刚好我有…

【微信小程序】开发环境配置

目录 小程序的标准开发模式&#xff1a; 注册小程序的开发账号 安装开发者工具 下载 设置外观和代理 第一个小程序 -- 创建小程序项目 查看项目效果 第一种&#xff1a;在模拟器上查看项目效果 项目的基本组成结构 小程序代码的构成 app.json文件 project.config…

8.2 Go 导入与导出

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

手机短信验证码登录

用户需求&#xff1a; 1、用户使用手机号和短信验证码登录系统 2、未注册过的手机号再登录时实现自动注册 3、新注册的账号只有7天的使用时间&#xff0c;过期后不允许进行登录 功能需求&#xff1a; 登录页面设计 图1.手机号登录 【验证码登录】规则说明&#xff1a; …

各类电机数学模型相关公式总结 —— 集成芯片驱动

0、背景技术概述 永磁直流电机&#xff08;PMDC&#xff09;、永磁同步电机&#xff08;PMSM&#xff09;、无刷直流电机&#xff08;BLDC&#xff09;以及混合式两相步进电机在小功率应用场景中多采用集成芯片驱动&#xff08;如二合一、三合一驱动芯片&#xff09;的原因主要…

Linux C语言:函数的基本用法及传参

一、函数的基本用法 1、main函数 int main(int argc, const char * argv[]) { printf("Hello world\n"); return 0; }数据类型 函数名称 (参数) { //.... return 表达式 } 2、函数 函数是一个完成特定功能的代码模块&#xff0c;其程序代码独立&#xff0c;通常要…

使用Python修改word文档中的表格

使用Python编辑word文档中的表格 介绍效果代码代码解析 介绍 使用python修改word文档中的表格。 效果 修改前的word文档&#xff1a; 注意红框中的表格。 修改后的word文档&#xff1a; 表格内容已经修改。 代码 from docx import Document# 加载现有的Word文档 doc D…

electron基础使用

安装以及运行 当前node版本18&#xff0c;按照官网提供操作&#xff0c;npm init进行初始化操作&#xff0c;将index.js修改为main.js&#xff0c;执行npm install --save-dev electron。&#xff08;这里我挂梯子下载成功了。&#xff09;&#xff0c;添加如下代码至package.…

AI办公自动化:用Kimi批量在Excel文件名中加入日期

工作任务&#xff1a;在一个文件夹中所有的Excel文件后面加上一个日期 在Kimi中输入提示词&#xff1a; 你是一个Python编程专家&#xff0c;写一个Python脚本&#xff0c;具体步骤如下&#xff1a; 打开文件夹&#xff1a;F:\AI自媒体内容\AI行业数据分析\投融资 读取里面所…

电商核心技术系列58:电商平台的智能数据分析与业务洞察

相关系列文章 电商技术揭秘相关系列文章合集&#xff08;1&#xff09; 电商技术揭秘相关系列文章合集&#xff08;2&#xff09; 电商技术揭秘相关系列文章合集&#xff08;3&#xff09; 电商核心技术揭秘56&#xff1a;客户关系管理与忠诚度提升 电商核心技术揭秘57:数…

Codeforces Round 951 (Div. 2) A~E

A.Guess the Maximum&#xff08;枚举&#xff09; 题意&#xff1a; 爱丽丝和鲍勃想出了一个相当奇怪的游戏。他们有一个整数数组 a 1 , a 2 , … , a n a_1,a_2,\ldots,a_n a1​,a2​,…,an​。爱丽丝选择了某个整数 k k k并告诉了鲍勃&#xff0c;然后就发生了下面的事情&…

UiPath发送邮件给多人时需要注意哪些限制?

UiPath发送邮件给多人的步骤&#xff1f;如何使用UiPath发信&#xff1f; 尽管UiPath提供了强大的邮件发送功能&#xff0c;但在批量发送邮件时&#xff0c;有一些限制和注意事项是我们必须了解的。AokSend将详细介绍这些限制&#xff0c;并提供一些优化建议。 UiPath发送邮件…

ArrayList和LinkedList的区别!!!

总结&#xff1a; 1、数据结构的实现 ArrayList&#xff1a;动态数组。 LinkedList&#xff1a;双向链表。 2、时间复杂度不同 ArrayList&#xff1a;O(1) LinkedList: O(n) ①&#xff1a;随机访问---- ArrayList > LinkedList &#xff08;ArrayList采用下标&#xff0…

frps 0.33

一个模拟示例 下载windows版本的frfps 需要准备的测试设备 一台frp服务器一台frp客户端PCsscom5.exe测试软件开2个,来模拟野外的设备和本地连接野外设备的软件。原理 frp服务器搭建了一条中转的桥梁,frp的客户端在本地做好端口映射后,本地的设备软件就可以连接到野外的设…

第34章-WLAN

1. 概述 2. WLAN模式 3. 相关概念 1. 概述 ① 定义WLAN(Wireless Local Area Network,无线局域网)&#xff0c;是一种技术&#xff1b; ② WLAN技术&#xff1a; Wi-Fi WAPI&#xff1a;中国强制标准&#xff1b; 例子&#xff1a;苹果手机 -- 设置 -- 国行(无线局域网设置) …

大众点评全国学习培训POI采集99万家-2024年5月底

大众点评全国学习培训POI采集99万家-2024年5月底 店铺POI点位示例&#xff1a; 店铺id k40VtNBN3bixFJIU 店铺名称 梦想钢琴成人钢琴(珠江新城总部) 十分制服务评分 9.4 十分制环境评分 9.4 十分制划算评分 9.4 人均价格 80 评价数量 6705 店铺地址 华穗路263号双城国…

Python酷库之旅-比翼双飞情侣库(01)

目录 一、xlrd库的由来 二、xlrd库优缺点 1、优点 1-1、支持多种Excel文件格式 1-2、高效性 1-3、开源性 1-4、简单易用 1-5、良好的兼容性 2、缺点 2-1、对.xlsx格式支持有限 2-2、功能相对单一 2-3、更新和维护频率低 2-4、依赖外部资源 三、xlrd库的版本说明 …

1 机器人软件开发学习所需通用技术栈(一)

机器人软件工程师技术路线&#xff08;如有缺失&#xff0c;欢迎补充&#xff09; 1. 机器人软件开发工程师技术路线 1.1 基础知识 C/C编程&#xff1a;掌握C/C语言基础&#xff0c;包括数据结构、算法、内存管理等。操作系统&#xff1a;了解Linux或Windows等操作系统的基本…