[小程序开发] 构造页面

 

一、Component方法

Component方法用于创建自定义组件,小程序页面也可以使用Component方法进行创建,从而实现复杂的页面逻辑开发。

使用Component方法构造页面,可以实现更加复杂的页面逻辑开发。

二、注意事项

    1、要求.json文件中必须包含usingComponents字段。

    2、里面的配置项要和Component中的配置项保持一致。

    3、页面中Page方法有一些钩子函数、时间监听方法,这些钩子函数、时间监听方法必须放到methods对象中。

    4、组件的属性properties也可以接收页面的参数,在onLoad钩子函数中可以通过this.data进行获取。

Component({

    // 组件的属性properties也可以接收页面的参数,在onLoad钩子函数中可以通过this.data进行获取
    properties:{
        id:String,
        title:String
    },

    data:{
        name:"tom"
    },

    methods:{
        updateDate(){
            this.setData({
                name:'jerry'
            })
        },

     onLoad(options){

         // 传参通过options接收
         console.log('页面加载')
         console.log(options)

         // 使用properties进行接受,使用this.data进行获取
         console.log(this.data.id)
         console.log(this.data.title)

         // 使用properties进行接受,使用this.properties进行获取
         console.log(this.properties)

        }
    }


})

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

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

相关文章

Iframe 嵌入: 页面嵌入并保持自适应页面的宽高并铺满整个屏幕

文章目录 问题分析1. 嵌入 Iframe2. 样式3. 源码 问题 当我们使用 Iframe 嵌入页面后&#xff0c;会看到它只在小小的一部分进行展示&#xff0c;如何让它铺满整个屏幕 分析 1. 嵌入 Iframe <template><div><iframe :src"embeddedPageUrl" width…

【编程项目开源】微信飞机大战(鸿蒙版)

目标 仿微信飞机大战 效果 开发工具 下载DevEco Studio 工程截图 开源地址 https://gitee.com/lblbc/plane_game/tree/master/PlaneGame_hongmeng_ArkTS 关于 厦门大学计算机专业|华为八年高级工程师 专注《零基础学编程系列》 http://lblbc.cn/blog 包含&#xff1a;Ja…

18.相交链表

给你两个单链表的头节点 headA 和 headB &#xff0c;请你找出并返回两个单链表相交的起始节点。如果两个链表不存在相交节点&#xff0c;返回 null 。 图示两个链表在节点 c1 开始相交&#xff1a; 题目数据 保证 整个链式结构中不存在环。 注意&#xff0c;函数返回结果后&…

腾讯云2核4g服务器能支持多少人访问?没搞错吧

腾讯云轻量2核4G5M带宽服务器支持多少人在线访问&#xff1f;5M带宽下载速度峰值可达640KB/秒&#xff0c;阿腾云以搭建网站为例&#xff0c;假设优化后平均大小为60KB&#xff0c;则5M带宽可支撑10个用户同时在1秒内打开网站&#xff0c;并发数为10&#xff0c;经阿腾云测试&a…

2024年【P气瓶充装】模拟考试及P气瓶充装证考试

题库来源&#xff1a;安全生产模拟考试一点通公众号小程序 P气瓶充装模拟考试是安全生产模拟考试一点通生成的&#xff0c;P气瓶充装证模拟考试题库是根据P气瓶充装最新版教材汇编出P气瓶充装仿真模拟考试。2024年【P气瓶充装】模拟考试及P气瓶充装证考试 1、【多选题】《中华…

Java中的实用类讲解(上篇)

如果想观看更多Java内容 可上我的个人主页关注我&#xff0c;地址子逸爱编程-CSDN博客https://blog.csdn.net/a15766649633?spm1000.2115.3001.5343 使用工具 IntelliJ IDEA Community Edition 2023.1.4 使用语言 Java8 代码能力快速提升小方法&#xff0c;看完代码自己敲…

python 实现阿里云OSS文件上传

因为我们出口的带宽限制&#xff0c;测试经常找我给他上传个包到阿里云的对象存储&#xff0c;虽然传起来也不是很费事&#xff0c;但是出于运维的职业素养&#xff0c;特意写了一个自动上传的接口&#xff0c;代码如下&#xff1a; # -*- coding: UTF-8 -*- from flask imp…

【保姆及教程】简直不要太爽了!md文件图床工具picgo配合typora和阿里云oss存储,实现文md文件的复制转贴

md文件图床工具picgo的安装和使用、配合阿里云面向对象oss 一、网址 官方网址&#xff1a;https://molunerfinn.com/PicGo/ github地址&#xff1a;https://github.com/Molunerfinn/picgo/releases 选择对应的版本下载即可 但也可以提供我给你的下载的地址&#xff1a; 方…

前端学习之css选择器--基本选择器、关系选择器、属性选择器、复合选择器、伪类选择器

目录 基本选择器 结果 关系选择器 结果 父子关系 祖先后代关系 相邻兄弟关系 兄弟关系 ​编辑 属性选择器 结果 复合选择器 结果 伪类选择器 结果 伪类选择器-操作标签 结果 未访问 访问后 悬停 基本选择器 <!DOCTYPE html> <html lang"en"…

Java-PriorityQueue源码分析

PriorityQueue 源码分析 Java中的PriorityQueue采用的是堆这种数据结构来实现的,而存储堆采用的则是数组。 堆是一个完全二叉树,堆中每一个节点的值都必须大于等于(或小于等于)其子树中每个节点的值,对于每个节点的值都大于等于子树中每个节点值的堆&#xff0c;我们叫做大顶…

数学建模--MATLAB基本使用

1.线性方程组 这个是一个线性方程组&#xff08;属于线性代数的范畴&#xff09;&#xff0c;Axb类型的方程&#xff0c;如果使用MATLAB进行求解&#xff0c;就需要分别表示A矩阵&#xff08;线性方程组未知数前面的系数&#xff09;&#xff0c;b矩阵&#xff08;表示等式右边…

探索Docker:原理、安装与基础应用

进程: 一旦“程序”被执行起来&#xff0c;它就从磁盘上的二进制文件&#xff0c;变成了计算机内存中的数据、寄存器里的值、堆栈中的指令、被打开的文件&#xff0c;以及各种设备的状态信息的一个集合。像这样一个程序运行起来后的计算机执行环境的总和称为进程 静态表现&am…

数据结构:基于数组实现简单的数据缓存区(简单队列)

1 前言 在我们使用CAN或者以太网调试时&#xff0c;经常需要缓存最近n次收到的数据&#xff0c;以便于我们对数据进行分析。 实现这一想法我们很容易就会想到队列&#xff0c;队列就是一种先进先出的数据结构&#xff0c;之前在《数据结构&#xff1a;基于数组的环形队列&…

win10 + cpu + pycharm + mindspore

MindSpore是华为公司自研的最佳匹配昇腾AI处理器算力的全场景深度学习框架。 1、打开官网&#xff1a; MindSpore官网 2、选择以下选项&#xff1a; 3、创建conda 环境&#xff0c;这里python 选择3.9.0&#xff0c;也可以选择其他版本&#xff1a; conda create -c conda-…

xray问题排查,curl: (35) Encountered end of file(已解决)

经过了好几次排查&#xff0c;都没找到问题&#xff0c;先说问题的排查过程&#xff0c;多次确认了user信息&#xff0c;包括用户id和alterid&#xff0c;都没问题&#xff0c;头大的一逼 问题排查过程 确保本地的xray服务是正常的 [rootk8s-master01 xray]# systemctl stat…

【力扣白嫖日记】1934.确认率

前言 练习sql语句&#xff0c;所有题目来自于力扣&#xff08;https://leetcode.cn/problemset/database/&#xff09;的免费数据库练习题。 今日题目&#xff1a; 1934.确认率 表&#xff1a;Signups 列名类型user_idinttime_stampdatetime User_id是该表的主键。每一行都…

人工智能原理:探索智能的奥秘

人工智能&#xff08;Artificial Intelligence&#xff09;&#xff0c;英文缩写为AI。是新一轮科技革命和产业变革的重要驱动力量&#xff0c;是研究、开发用于模拟、延伸和扩展人的智能的理论、方法、技术及应用系统的一门新的技术科学。 人工智能是智能学科重要的组成部分&a…

XXE漏洞原理和pikachu靶场实验

★★免责声明★★ 文章中涉及的程序(方法)可能带有攻击性&#xff0c;仅供安全研究与学习之用&#xff0c;读者将信息做其他用途&#xff0c;由Ta承担全部法律及连带责任&#xff0c;文章作者不承担任何法律及连带责任。 1、XXE漏洞原理 XXE全称&#xff1a;XML External Enti…

YOLOv9更换iou|包含CIoU、DIoU、MDPIoU、GIoU

专栏介绍&#xff1a;YOLOv9改进系列 | 包含深度学习最新创新&#xff0c;助力高效涨点&#xff01;&#xff01;&#xff01; 一、改进点介绍 更换YOLOv9中使用的Iou计算方式&#xff0c;目前支持CIoU、DIoU、MDPIoU、GIoU。 二、Iou模块详解 2.1 模块简介 Iou的主要思想&…

【Poi-tl Documentation】自定义行删除标签

前置说明&#xff1a; <dependency><groupId>com.deepoove</groupId><artifactId>poi-tl</artifactId><version>1.12.1</version> </dependency>模板样式&#xff1a; 删除行表格测试.docx 实现思路&#xff1a;通过定制占位…