• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

小程序教程1

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

微信小程序开发教程

  1. 简介
    它是一个基于微信提供的一个过桥工具实现很多h5在公众号很难实现的功能,有点类似于hybrid开发,不同于hybrid开发的方式是:微信开放的接口更为严谨,结构必须采用他提供给我们的组件,外部的框架和插件都不能在这里使用,让开发者完全脱离操作DOM,开发思想转变很大,理解他的核心功能非常重要,接下来一些列教程将会逐渐介绍小程序。

  2. 环境搭建

    • 下载demo代码
    • 获取微信小程序的 AppID,这个个人身份是不能申请的,所以这步跳过
    • 下载开发工具,点击这里,登陆需要扫描二维码
    • 工具打开之后,选择新建项目
      • APPID由于没有,所以不填写,选择无APPID
      • 项目名称随意
      • 项目地址就是把最开始下载的demo解压之后的路径(刚开始只是做案例,以后目录随意定)
  3. 代码结构分析

    • 点击左侧导航的编辑,我们可以看到这个项目中初始化的文件,其中最关键的是 app.js、app.json、app.wxss 这三个文件,.js文件是脚本文件,.json文件是配置文件,.wxss是样式文件,小程序会读取这些文件并且声称小程序实例
    • app.js文件是小程序的脚本文件,在这个文件中监听和处理小程序的声明周期函数,声明全局变量,调用MINA通讯框架提供的API,
    • app.json是整个小程序的全局配置,我们在这个文件中配置小程序由哪些文件组成,配置小程序的窗口背景色,导航条样式,默认标题等(该文件不可添加任何注释
    • app.wxss是整个小程序的公共样式文件,在组件中可以直接使用在app.wxss中定义的样式规则
    • pages目录专门放我们的页面文件,微信小程序中的每一个页面的路径(路径+页面名)都需要些在app.json中的pages中,并且pages中的第一个就是小程序首页。
    • pages文件夹下的每个页面组件都是一个文件夹,该文件夹下由.js,.wxml,.json,.wxss四个文件组成,.js文件是脚本文件,.json文件是配置文件,.wxml文件是页面结构文件,.wxss文件页面的样式文件
    • 页面的样式和配置文件都不是必须的,当你添加了这两个文件的话会覆盖app.wxss和app.json,不添加的话会使用这两个全局文件的样式和配置
  4. 生命周期

    • 它的生命周期是App Launch-->App Show-->onload-->onShow-->onReady
    • 首先是整个app的启动与显示,app的启动在app.js里面可以配置,其次再进入到各个页面加载显示(后面会详细介绍声明周期)
  5. 路由

    微信对路由的介绍很少,只提供了三个方法,已经基本够用了,开发者可以不用像其他框架那样繁琐的去配置路由了

    • wx.navigateTo(object):保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。
    • wx.redirectTo(object):关闭当前页面,跳转到应用内的某个页面。
    • wx.navigateBack():关闭当前页面,回退前一页面。
  6. 组件

    微信在组件方面也是提供的非常全面,基本上满足项目开发需求,所以开发速度应该会很快,开发之前需要认真的看几遍,开发速度会很高

  7. 其他

    • 任何的外部框架都无法使用,就算是原生的js插件也很难使用,主要是由于微信小程序此次的架构不允许操作DOM
    • 此次微信提供了webSocket,可以直接用它做聊天,可以开发的空间非常大
    • wxss样式文件可以直接在里面写样式,也可以采用引入的方式,公共样式可以在app.wxss中引入
        @import "wxss/index.css";
        body {
            background:\'#f00\';
        }
    
    • 写配置项的时候无论键值都要用双引号包裹,否则会编译错误

鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
小程序发布时间:2022-07-18
下一篇:
小程序1发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap