微信小程序之自定义组件与使用
一般我们在定义了一个组件之后,为了复用,需要将它导出以提供给其他页面使用。
组件导出的关键字是
exprot default
没有加default时,例如:
export class Template{}
当然,你可以在单个js文件里声明多个组件,例如Templates.js
export class Template{}
export class AnotherTemplate{}
这样在其他文件引用时,需要使用{}符号且组件名称必修和class名称一样,像这样子:
import {Template,AnotherTemplate} from './components/Templates';
而加default时,例如:
export default class Template{}
然后在其他文件引用,像这样子:
import Template from './components/Templates';
你也可以为这个组件另起一个别名,像这样子:
import TheTemplate from './components/Templates';
但是每个文件里只能有个default组件,可以包含其他非default组件:
export default class Template{}
export class AnotherTemplate{}
然后引用的时候,如下:
import Template,{AnotherTemplate} from './components/Templates';
总结
- 有default和没有default的区别在于:有default在引用时可以自定义名称,而没有default时需要使用{}括起来且名称必修和class名称一致
- 每个文件里只能有一个default组件,但可以有多个非default组件
微信小程序之自定义组件与使用的更多相关文章
- 微信小程序之自定义组件的应用
小程序支持自定义组件,下面是一个简单的购物车组件,实现的效果如图: 效果图 创建组件 在根目录创建components目录,然后创建计数组件 count 如图: 组件内容 <!--compone ...
- 微信小程序之自定义组件
在微信小程序项目中 肯定会存在很多功能和样式上相似的部分 面对这种情况 只是单单的ctrl+c ctrl+v 就显得很low了,而且也不便于后期维护那么这时候 使用微信小程序中的自定义组件功能就很合适 ...
- 微信小程序:自定义组件
为什么要学习自定义组件? 1.用上我自己的单词abc,我希望在页面中展示椭圆形的图片, 2.打开手机淘宝,假如现在要做一个企业级项目,里面有很多页面,首页存在导航模块,点击天猫,进入第二个页面,而第二 ...
- 微信小程序覆盖自定义组件样式
小程序官方文档明确指出,引入的第三方自定义组件,是不可以对其进行CSS样式覆盖的,但是我们还想要修改怎么办呢?自定义组件时会之定义个外部类,通过这个外部类来修改样式. 修改https://weapp. ...
- 微信小程序:自定义组件的数据传递
一.前言 如果小程序中有可复用的UI且具有一定的功能性,就可以使用自定义组件将其封装起来.下面介绍一个简单的组件和一个复杂的组件. 二.简单的组件(计数器) 1. 组件功能介绍 这个组件常见于外卖软件 ...
- 微信小程序开发---自定义组件
开发者可以将页面内的功能模块抽象成自定义组件,以便在不同的页面中重复使用:也可以将复杂的页面拆分成多个低耦合的模块,有助于代码维护.自定义组件在使用时与基础组件非常相似. 创建自定义组件 类似于页面, ...
- 微信小程序里自定义组件,canvas组件没有效果
methods: { /** * el:画圆的元素 * r:圆的半径 * w:圆的宽度 * 功能:画背景 */ drawCircleBg: function (el, r, w) { const ct ...
- 微信小程序中的组件使用1
不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...
- 【小程序】小程序开发自定义组件的步骤>>>>>>>>>小程序开发过程中报错:jsEnginScriptError
报错:jsEnginScriptError VM6342: jsEnginScriptError Component is not found in path "component/spac ...
随机推荐
- EasyPlayerPro Windows播放器电子放大/局部放大播放功能实现
背景描述 在视频监控软件中,我们看到很多的软件都有电子放大功能, 按住鼠标左键不放,框选一个区域,再松开鼠标左键,即对选中的区域进行放大显示, 且可以重复该操作,逐步放大所需显示的区域, 有没有觉得, ...
- EasyDSS RTMP流媒体服务器是怎样炼成的:Easy而且更加互联网!
开发EasyDSS的初衷 自从12年开始做EasyDarwin的时候,当时眼光一直都仅仅局限在安防监控视频这一块,对RTMP没有太大的重视,对于后起之秀HLS更是没有太多关注,然而经历了15直播火热的 ...
- 九度OJ 1015:还是A+B (基础题)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:6773 解决:4031 题目描述: 读入两个小于10000的正整数A和B,计算A+B.需要注意的是:如果A和B的末尾K(不超过8)位数字相同 ...
- iOS视频直播用到的协议
一 .流媒体 1 - 伪流媒体 1.1 扫盲:边下载边播放1.2 伪流媒体:视频不是实时播放的,先把视频放在数据库,再供客户端访问,比如:优酷,爱奇艺等 1.3 特点: 边下边存,文件会保存.遵守了 ...
- IIS7:通过脚本来配置ftp站点
Appcmd.exe是IIS7提供的一个管理站点的命令行工具,同时支持Ftp和Http的站点,功能还算强大,具体使用方法参考微软网站. 需求 我这里的例子主要配置一个Ftp站点,并且允许CcUser这 ...
- RaspBerry Pi3 ~ 内核编译
RaspBerryPi3-内核编译 转载注明出处:http://www.cnblogs.com/einstein-2014731/p/5985128.html 在有道云笔记的同步分享:http://n ...
- 【Leetcode-easy】Reverse Integer
思路:取绝对值,反转,并判断反转的结果是否大于最大整数,需要注意的细节:判断时需要这样:result > (Integer.MAX_VALUE - v) / 10 否则result * 10 + ...
- P4474 王者之剑
P4474 王者之剑 题目大意 n*m的带权网格,任意选择起点开始时刻为0秒.以下操作,每秒按顺序执行 在第i秒开始的时候,在方格(x,y)上,获得(x,y)的值 在偶数秒,周围四格的值清零 每秒可选 ...
- POJ1113 Wall —— 凸包
题目链接:https://vjudge.net/problem/POJ-1113 Wall Time Limit: 1000MS Memory Limit: 10000K Total Submis ...
- Linux之make的用法讲解
在 Linux环境下使用 GNU 的 make工具能够比较容易的构建一个属于你自己的工程,整个工程的编译只需要一个命令就可以完成编译.连接以至于最后的执行.不过这需要我们投入一些时间去完成一个或者多个 ...