小程序系列(1)— 组件模板(上)

话不多说,直接上步骤,老手请略过...

先开个头:
组件,通常会被存放在根目录下的components目录中,依据功能的不同,可以创建不同的文件夹,存放不同功能的组件(不排除其他情况,具体引人而异)

目录结构

如上所示,components目录中新建了一个like组件,那么怎么使用呢?其实也很简单,主要分两步进行,1是导出组件,2是导入组件

1.导出组件

在like目录下的 index.json 文件中配置如下,即可以导出组件

//index.json
{
  "component": true,
  "usingComponents": {}
}

组件的样式以及骨架,可以在index.wxmlindex.wxss文件中进行定义(这里我就不做介绍了,比较简单...)

2.导入组件

在home目录下的 home.json 文件中,做如下配置,既可引入组件

//home.json
{
  "usingComponents": {
    "v-like": "/components/like/index"
  }
}

注意,上面的 [ v-like ] 名称可以自定义(但是命名最好简短易于理解),然后到home.wxml文件中,如下使用组件既可

<v-like></v-like>

3.小结

文章很短,主要介绍组件模板的基本使用方式,关于组件的交互等功能配置,小编抽空再整理下放到下章进行介绍。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容