微信小程序开发---自定义组件的基本使用

目录

一、自定义组件的样式

二、data数据

三、methods方法

四、properties属性


一、自定义组件的样式

默认情况下,自定义组件的样式只会对当前组件生效,不会影响组件之外的UI结构。

app.wxss中的全局样式对组件无效,只有class选择器会有隔离效果,其它选择器不受影响,所以建议使用class选择器

二、data数据

在小程序中,用于组件模板渲染的私有数据,需要定义到data节点

javascript 复制代码
data: {
     a:0,
     b:0,
     c:0
  },

三、methods方法

在小程序组件中,事件处理函数和自定义方法需要定义到methods节点中。

javascript 复制代码
methods: {
     add1(){
       this.setData({
         a:this.data.a+1
       })
     },
     add2(){
       this.setData({
         b:this.data.b+1
       })
     },
     _showcount(){//自定义方法建议以_开头
      //显示弹窗
       wx.showToast({
         title: 'title',
         icon:"none"
       })
     }
  },

四、properties属性

在小程序组件中,properties是组件的对外属性,用来接受外界传递到组件中的数据

javascript 复制代码
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    a:{
      type:Number,
      value:100
    }

  },
})





<new1 a="10"></new1>
相关推荐
资质小秘书9 小时前
2026 年 8 月行业科普:小程序商家需要北京 ICP 许可证吗?
其他·小程序
2501_9160088916 小时前
移动安全之 APP 加固,保障移动应用安全的重要手段
安全·macos·ios·小程序·uni-app·iphone·xcode
Ai-_Man17 小时前
豆包智能体内容批量导出:哪些该存、存成什么、怎么存v
人工智能·ai·小程序·word
黄华SJ520it20 小时前
三三复制公排系统:裂变电商新引擎
小程序·系统开发
维双云21 小时前
2026做小程序怎么选服务商?SaaS平台与定制公司优缺点分析
小程序
2501_9151063221 小时前
Python爬虫从零开始:七天掌握HTTP协议、数据解析与反爬策略
android·ios·小程序·https·uni-app·iphone·webview
禾高网络2 天前
开启环保新潮流:回收小程序系统功能介绍
java·大数据·小程序
laboratory agent开发2 天前
多维度拆解小程序平台:数字化经营工具的理性选择指南
微信小程序
2501_915921432 天前
详细解析,iOS 应用上架 App Store 的完整流程与指南
android·ios·小程序·https·uni-app·iphone·webview
微三云 - 廖会灵 (私域系统开发)2 天前
小程序商城系统安全运维剖析:漏洞、风控与长效迭代方案
运维·小程序·系统安全