小程序自定义的组件:

(1)组件的结构

  自定义的组件和普通的页面定义没有什么区别,也包含了四个文件:xxx.wxml(组件的视图层),xxx.json,xxx.js,xxx.wxss

  组件的xxx.wxml页面: 

<view class="wrapper">
<view>这里是组件的内部节点</view>
<slot></slot>
</view>

  <slot>标签的用处是:当一个页面引用给组件的时候,使用方法为:<组件名>内容</组件名>(组件名是在页面的json文件中定义的),内容就是显示在<slot>标签里面,通常一个组件只能使用一个<slot>标签,但是也可以使用多个,不过要配置,下面会讲。

(2)组件的Component构造器

  Component构造器可用于定义组件,调用Component构造器可以指定组件的属性,数据,方法等。

  可查看:Component构造器中的各种定义的含义:https://developers.weixin.qq.com/miniprogram/dev/reference/api/Component.html

      Component构造器的列子:https://developers.weixin.qq.com/miniprogram/dev/framework/custom-component/component.html

(3)组件的solt支持

(4)组件的生命周期

  

1.当组件从调用它的页面中获取值的时候,应该将保存改值的属性放在属性列表中,而不是data列表中,

微信小程序之组件常见的问题的更多相关文章

  1. 微信小程序image组件binderror使用例子(对应html、js中的onerror)

    官方文档  binderror HandleEvent 当错误发生时,发布到 AppService 的事件名,事件对象event.detail = {errMsg: 'something wrong' ...

  2. 微信小程序倒计时组件开发

    今天给大家带来微信小程序倒计时组件具体开发步骤: 先来看下最终效果: git源:http://git.oschina.net/dotton/CountDown 分步骤-性子急的朋友,可以直接看最后那段 ...

  3. 微信小程序input组件抖动及textarea组件光标错位解决方案

    问题一: 使用微信小程序input组件时,在移动端唤起focus或blur事件时,因光标占位导致内容出现叠影及抖动现象. 解决方案: 用<textarea>组件代替了<input/& ...

  4. 5个最优秀的微信小程序UI组件库

    开发微信小程序的过程中,选择一款好用的组件库,可以达到事半功倍的效果.自从微信小程序面世以来,不断有一些开源组件库出来,下面5款就是排名比较靠前,用户使用量与关注度比较高的小程序UI组件库.还没用到它 ...

  5. 微信小程序弹窗组件

    概述 自己封装的一个比较简单微信弹窗小组件,主要就是教会大家对微信小组件的用法和理解,因为微信小程序对组件介绍特别少,所以我就把自己的理解分享给大家 详细 代码下载:http://www.demoda ...

  6. 微信小程序的组件总结

    本文介绍微信小程序的组件 视图容器 基础内容 表单组件 导航组件 媒体组件 视图容器 view 布局容器 <view hover-class='bg'>222</view> 可 ...

  7. Wuss Weapp 一款高质量,组件齐全,高自定义的微信小程序 UI 组件库

    Wuss Weapp 一款高质量,组件齐全,高自定义的微信小程序 UI 组件库 文档 https://phonycode.github.io/wuss-weapp 扫码体验 使用微信扫一扫体验小程序组 ...

  8. 微信小程序UI组件库 iView Weapp快速上手

    概述 今天在网上突然看到iView新出了一个微信小程序的组件库iView Weapp,自己就上手试了一下,发现用起来还是不错的,把自己使用的过程与大家分享下. 一 预览iView组件 1.可以在手机上 ...

  9. 6个最优秀的微信小程序UI组件库

    开发微信小程序的过程中,选择一款好用的组件库,可以达到事半功倍的效果.自从微信小程序面世以来,不断有一些开源组件库出来,下面6款就是排名比较靠前,用户使用量与关注度比较高的小程序UI组件库.还没用到它 ...

随机推荐

  1. Oracle delete 之后恢复数据

    当我们粗心大意直接delete from不加条件而又没有回滚的时候有一个很简单的方法能够将数据恢复到delete之前的状态 第一种方案已经帮助我解决了实际问题.第二种方案暂未实践 在此记录下以便日后查 ...

  2. Xcode8.0+和最新的Xcode9.0beta安装Alcatraz插件

    1.安装Alcatraz 1.1终端中输入 rm -rf ~/Library/Application\ Support/Developer/Shared/Xcode/Plug-ins/Alcatraz ...

  3. jQuery事件 - toggle() 方法

    1.切换元素的显示与隐藏状态 实例 切换 <p> 元素的显示与隐藏状态: $(".btn1").click(function(){ $("p").h ...

  4. 挖矿程序minerd入侵分析和解决办法

    现在比特币的价格涨得很高,所以现在有黑客专门制造挖矿木马来诱导网友,从而达到控制电脑上的显卡来挖掘比特币.为什么木马要控制电脑中的显卡呢?因为显卡挖掘虚拟货币比特币的效率远比 CPU 要高.如果你是一 ...

  5. python三大神器===》装饰器

    1.认识装饰器 如果你经常看我的博客,你已经学会了python的前两大‘神器’(迭代器,生成器),那么什么是装饰器呢?就如字面意义装饰器是对某个事物(通常指函数)进行装饰,让其在不修改任何内部代码的情 ...

  6. 官网英文版学习——RabbitMQ学习笔记(八)Remote procedure call (RPC)

    在第四篇学习笔记中,我们学习了如何使用工作队列在多个工作者之间分配耗时的任务.   但是,如果我们需要在远程计算机上运行一个函数并等待结果呢?这是另一回事.这种模式通常称为远程过程调用或RPC.   ...

  7. POJ 1770 树形DP

    咋一看确实想到的是树形DP,但是我一开始也马上想到环的情况,这样应该是不可以进行树形DP的,然后我自以为是地想用有向图代替无向图,而且总是从能量高的指向能量低的,这样自以为消除了环,但是其实是不对滴, ...

  8. 吴裕雄--天生自然C++语言学习笔记:C++ 运算符

    运算符是一种告诉编译器执行特定的数学或逻辑操作的符号.C++ 内置了丰富的运算符,并提供了以下类型的运算符: 算术运算符 关系运算符 逻辑运算符 位运算符 赋值运算符 杂项运算符 算术运算符 下表显示 ...

  9. hdu 1087 最长上升序列和 dp

    Super Jumping! Jumping! Jumping! Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 ...

  10. 第二篇MTV模型、基本命令、简单配置

    MTV模型.基本命令.简单配置 阅读目录(Content) MTV模型 基本命令 简单配置 MTV模型 Django的MTV分别代表: Model(模型):负责业务对象与数据库的对象(ORM) Tem ...