微信小程序> 如何创建一个微信小程序-如何创建微信打卡小程序-微信考勤打卡小程序

如何创建一个微信小程序-如何创建微信打卡小程序-微信考勤打卡小程序

浏览量:5407 时间: 来源:依旧平凡
1.

一、小程序结构目录的创建:

2.

1、首先打开微信公众平台|小程序的官方文档:https://mp.weixin.qq.com

3.

2、按照官方文档的小程序发布流程,完善信息,申请到自己的小程序开发ID

4.

地址:https://mp.weixin.qq.com/wxopen/waregister?actionstep1

5.

3、申请完ID之后,下载微信开发者工具,

6.

下载地址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html

7.

4、安装完微信开发者工具后,打开开发者工具,在本地新建一个自己小程序的文件夹,在微信开发者工具里面就可以看到小程序的结构目录完成了。

8.

如果不够详细,可以查看百度经验:https://jingyan.baidu.com/article/ad310e80eeedd71848f49e53.html

9.

引入UI库:

10.

1、下载WeUI。下载WeUI框架的github地址:https://github.com/weui/weui-wxss/

11.

2、我们只需要将weui-wxss-masterdiststyleweui.wxss文件导入到小程序项目的根目录下

12.

3、在项目中引用:在全局app.wxss中加入weui.wxss的引用-@import"weui.wxss";

13.

5根组件使用class”page”

viewclass"page"/view14.

6页面骨架

viewclass"page"viewclass"page__hd"/view!--页头--viewclass"page__bd"/view!--主体--view/view!--未设置页脚--/view15.

7除此之外都是按照weui-开头后接组件名称,例如class”weui-footer”

viewclass"weui-footer"我是页脚/view16.

8组件的子组件样式,例如view.weui-footer组件还有链接和版权信息。

viewclass"weui-footer"viewclass"weui-footer__links"navigatorurl""class"weui-footer__link"上海物联网科技有限公司/navigator/viewviewclass"weui-footer__text"Copyright©程序媛专用/view/view17.

9、具体组件在小程序中新建个项目,地址指向weui-wxss-masterdist,就可以随时查找自己要的效果,剩下的就是复制粘贴了,或者导入从github上下载代码中的实例使用,

18.

以下为小程序引用UI库的学习资源:

19.

原文作者:祈澈姑娘原文链接:https://www.jianshu.com/u/05f416aefbe1

20.

微信小程序从零开始开发步骤(一)搭建开发环境https://www.jianshu.com/p/0ff8c3b2f59f微信小程序从零开始开发步骤(二)创建小程序页面https://www.jianshu.com/p/fe0db14e2869微信小程序从零开始开发步骤(三)底部导航栏https://www.jianshu.com/p/89a63dc99839微信小程序从零开始开发步骤(四)自定义分享的功能https://www.jianshu.com/p/65d9bdb8051d微信小程序从零开始开发步骤(五)轮播图https://www.jianshu.com/p/bc3261557031微信小程序从零开始开发步骤(六)4种页面跳转的方法https://www.jianshu.com/p/01a5a6a0fdb9微信小程序从零开始开发步骤(七)引入外部js文件https://www.jianshu.com/p/5f2cde64d7f2微信小程序从零开始开发步骤(八)引入框架WeUI:https://www.jianshu.com/p/fd423b6e17be

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎