小程序开发

Posted 2021-10-04 shmily墨鱼

环境配置

• python
  • django 以及drf 作为后端
• 小程序的环境

  • 申请一个微信公众平台小程序账号

  • 保存自己的appid

  • 下载安装开发者工具

  • 创建项目

开发小程序

• 全局配置

{
  "pages": [
    "pages/index/index",
    "pages/logs/logs",
    "pages/mypage/mypag"
  ],
  "window": {
    "backgroundTextStyle": "light",
    "navigationBarBackgroundColor": "#ddd",
    "navigationBarTitleText": "墨鱼之家",
    "navigationBarTextStyle": "black"
  },
  "tabBar": {
    "selectedColor": "#E9967A",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页"
      },
      {
        "pagePath": "pages/logs/logs",
        "text": "日志"
      },
      {
        "pagePath":"pages/mypage/mypag",
        "text":"我的页面"
      }
    ]
  },
  "style": "v2",
  "sitemapLocation": "sitemap.json"
}

• 组件

  • text 编写text类似于span
  • view 布局容器类似div
  • image 图片

• flex布局

display: flex;
  /* 排列方向 ，规定主轴方向为水平（从左到右）*/
  flex-direction: row;
  /* 在主轴方向上如何展示*/
  justify-content: space-around;
  /* 副轴方向上如何展示 */
  /* align-items: center; */

不仅仅适用于小程序，网页布局也可以用

博观而约取，厚积而薄发。