微信小程序开发-基本教程

1.新建页面

  • 一般右键pages -> 新建目录 new-page
  • 右键 new-page -> 新建 Page > new-page

在这里插入图片描述

  • 在page-wxml中开始编排

在这里插入图片描述

  • 添加编译模式

在这里插入图片描述
在这里插入图片描述

  • 填入页面路径 pages/new-page/new-page

在这里插入图片描述

  • 确定后,页面即可展现
    在这里插入图片描述

2.创建模板

  • pages下创建目录 template

在这里插入图片描述

  • 选中template右键,新建WXML :my-template

在这里插入图片描述

  • 模板代码, name填入模板名称

在这里插入图片描述

  • new-page页面引用, 通过import与 template
  • template中is属性填入模板的name属性

在这里插入图片描述
在这里插入图片描述

  • 传递参数给模板
  • 页面参数

在这里插入图片描述

  • 传递参数,逗号隔开

在这里插入图片描述

3.使用组件

  • 使用意义,组件可以说是模板的扩展,可以包含自身行为

  • 选中pages,右键 -》创建目录 comp

  • 选中comp, 右键 -》 新建 Component 》 comp-test
    在这里插入图片描述

  • 编写组件代码
    在这里插入图片描述
    在这里插入图片描述

  • 页面引用 1. 声明引用 2. 标签使用

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

  • 若使用多个slot,组件需要声明

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

原创文章 20 获赞 21 访问量 3万+

猜你喜欢

转载自blog.csdn.net/lanxing_huangyao/article/details/106108624