zoukankan      html  css  js  c++  java
  • 小程序的学习

      小程序学习

      第一步:注册小程序账号  官网:https://mp.weixin.qq.com/

      熟悉小程序的发布流程:添加开发者,可以多人开发项目

      添加开发者的操作:

        

      然后设置权限----->就可以实现多人开发了

      如果想上线的话,需要跟 github 绑定起来

      学习小程序的开发文档:  官网:https://developers.weixin.qq.com/miniprogram/dev/framework/

      1.下载开发工具

        新建项目的话,需要用到 appid 

      查看 appid 如图:

        

      为什么要使用 appid 呢?因为想使用他 提供的后台模板 ( node.js/php 两种)  操作如图:

        

      2.项目的目录

      pages:是存放所有的页面

      utils:存放插件的地方  使用了 common.js 规范

      app.js  app.json  app.wxss  全局文件

       3.小程序提供的组件(标签)

        wxml文件就是 html 文件,小程序里面没有标签,但是提供了具有丰富功能的组件

      添加一个页面需要在 app.json 的 pages 配置一下

      如 window 属性是配置小程序的主题

      我们不仅可以在 微信开发者工具里面修改代码,也可以在编辑器里面修改代码,但是看效果的话,我们还是要在微信开发者工具里面看;

      4.查看文档的流程:

        指南:看小程序的写法

        框架:了解小程序的配置项

        组件:看组件属性上赋予的功能

        api:看调用的方法  传递的参数  返回值  拥有什么功能

        服务器:看接口的功能  请求的地址  返回值

        如果拥有代码的部分,将代码复制下来,在微信开发者工具上查看效果;便可知道用法,还有一些细节性的东西,要总结

      因为小程序上传 2M 左右的大小,所以需要我们着重处理图片的部分,所以图片是不能写在项目中的,要通过服务器来请求图片

      5.逻辑层:

        逻辑层就是 js 这一部分,在每个小程序中,逻辑层分两个部分,一个是 app.js 全局的逻辑层,一个是页面的逻辑层 如page.js

        app.js 调用 App() 的方法,用于小程序的注册  page.js 调用 Page() 的方法,用于页面的注册

        对于 App() 方法的实例,在页面中用 getApp() 这个方法来获取

        App.js 可以存放公共数据,在 golbalData 属性上 

        getCurrentPages()  用来获取当前页面栈,当前页面的信息都存在这里,不如页面路径可用于路由跳转

       在微信小程序中 window 和 document 无效

        app.js 是一个公共的实例,任何页面都可以获取

        对于page.js 每个页面都有一个 page() 方法,用于注册页面的 有一个初始数据的属性 data

      6.生命周期,事件处理方法

        onPageScroll  页面滚动的方法

        onResize  窗口大小改变的方法

      生命周期:就是页面从无到加载完毕的一个过程

      页面生命周期:排版到加载完毕的过程

      页面的路由:navigator (相当于 a 连接)

      json 文件

        app.json:这是一个全局配置文件

        tabBar:底部切换的属性

        page.json:用于配置页面的当前项

      wxml 文件

        1.记住微信提供组件的种类

        2. 数据渲染 {{数据名}}

      列表渲染:wx:for 案例

        

        需要注意一点,使用 wx:for 时 后面一定要加 wx:key={{index}}

      条件渲染:wx:if 案例

        

      模板渲染:template 案例

        

      Page()  的 this 指向,Page() 的实例

      App()  的 this 指向,App() 的实例

       修改 data 中的原始数据,使用 this.setData()  参数:对象  注意 this 的指向

         

  • 相关阅读:
    【每日算法】C语言8大经典排序算法(2)
    C++虚函数与纯虚函数的区别
    C++ 运算符优先级列表
    【每日算法】C语言8大经典排序算法(1)
    C++中的友元函数和友元类
    二叉树前序、中序、后序遍历相互求法
    【转】运算符重载的例析
    从一个二级题来看成员函数重载运算符和友元函数重载运算符
    测试用例管理之 TestLink
    【转】关于LoadRunner的迭代
  • 原文地址:https://www.cnblogs.com/shangjun6/p/11004535.html
Copyright © 2011-2022 走看看