微信小程序的组件 component开发，提高效率第三篇

微信小程序组件，自定义更加快速完成开发

创建组件

首先建立一个文件夹主要是放置自定义组件的

之后，右击文件夹，新建component，填写名称，添加之后出现会出现

wxml和wxss页面的写法按照正常的小程序的规则走就好 .json 设置component 为true

{"component": true,"usingComponents": {}}

js页面的写法

const app = getApp();
Component({/*** 组件的属性列表*/properties: {statusBarHeight: {type: String,value: app.globalData.statusBarHeight}},/*** 组件的初始数据*/data: {isShowOrganizer: false,},ready:function(){//进入组件会执行},/*** 组件的方法列表*/methods: {ecodedt:function(e){console.log('组件的点击事件')this.triggerEvent('myevent', e.currentTarget.dataset)}}
})

properties	Object Map	否	组件的对外属性，是属性名到属性设置的映射表
data	Object	否	组件的内部数据，和 `properties` 一同用于组件的模板渲染

引入使用组件

需要引入页面的.json需要添加如下

"usingComponents": {"registered": "../../component/registered/registered",//页面路径"kefu": "../../component/kefu/kefu" //引入多个的写法}

wxml需要进行的操作 kefu 是跟json页面的内容对应的

<view><kefu info="{{info}}" bind:myevent="kefuBack"></kefu>
</view>

组件传参

<view><kefu info="{{info}}" bind:myevent="kefuBack"></kefu>
</view>//组件页面
this.triggerEvent('myevent', e.currentTarget.dataset)

微信小程序的组件 component开发，提高效率第三篇相关推荐

微信小程序之组件的开发
跟着视频开始小程序的项目的开发,视频中这个小程序已经上线了,可以很好的看着小程序的界面进行开发,昨天看了一下具体的需求,觉得真的细节好多啊,而且其中设计的组件的思想也是很好的,能够很好的实现代码的复用 ...
微信小程序 -- 自定义组件component并引入。
目前做的小程序项目,根据不同的登录角色,页面显示也有所不同,在wxml页面用了一堆的wx:if来控制显示,最终代码看起来很繁杂.所以就打算组件化,把相同部分封装起来. 先简单写一下吧. 配置 1. 在 ...
【小程序】微信小程序自定义组件Component详细总结
1- 前言在本文中你将收获小程序如何使用自定义组件自定义组件之间的传值自定义组件中插槽的使用 2- 组件文件新建 2.1 定义组件在根目录新建components文件夹,建立cell 文件夹 ...
微信小程序自定义组件Component的简单使用
首先为什么要使用component 这里列举2个例子, 1 如果项目中多个地方使用同一个弹框, 2 两个同事合作写一个界面, 这2中情况使用组件是比较好的选择开始吧第一步首先创建一个包用于存放组件 ...
微信小程序：组件Component接收不到参数id
custom-component.js Component({properties: {id: {type: String,},}, }); custom-component.wxml <vie ...
微信小程序自定义组件Component is not found in path components weimo tabbar index using by pages index inde
报错原因:components 本质上还是pages,所以需要在aap.json添加上即可附上解决过程·: 大家看到这个报错是不是先想到的是componets下面的tabbar或者pages下面的i ...
微信小程序 MinUI 组件库系列之 abnor 异常流组件
MinUI 是基于微信小程序自定义组件特性开发而成的一套简洁.易用.高效的组件库,适用场景广,覆盖小程序原生框架.各种小程序组件主流框架等,并且提供了高效的命令行工具.MinUI 组件库包含了很多功能 ...
微信小程序 MinUI 组件库系列之 label 标签组件
MinUI 是基于微信小程序自定义组件特性开发而成的一套简洁.易用.高效的组件库,适用场景广,覆盖小程序原生框架.各种小程序组件主流框架等,并且提供了高效的命令行工具.MinUI 组件库包含了很多基础 ...
微信小程序 MinUI 组件库系列之 badge 徽章组件
MinUI 是基于微信小程序自定义组件特性开发而成的一套简洁.易用.高效的组件库,适用场景广,覆盖小程序原生框架.各种小程序组件主流框架等,并且提供了高效的命令行工具.MinUI 组件库包含了很多基础 ...
微信小程序 MinUI 组件库系列之 avatar 头像组件
MinUI 是基于微信小程序自定义组件特性开发而成的一套简洁.易用.高效的组件库,适用场景广,覆盖小程序原生框架.各种小程序组件主流框架等,并且提供了高效的命令行工具.MinUI 组件库包含了很多基础 ...

微信小程序的组件 component开发，提高效率第三篇

创建组件

js页面的写法

引入使用组件

组件传参

微信小程序的组件 component开发，提高效率第三篇相关推荐

最新文章

热门文章