小程序配置

2020-04-08  本文已影响0人  一枚小菜

模块化=>组件化=>工程化
模块:js
组件:实现功能(JS)和效果(HTML+CSS)的代码片段

全局配置:

app.json:设置路径,配置窗口表现,网络超时,tab栏


{
  "pages": [
    "pages/index/index", //页面的路径
  ],
  "window": {
    "backgroundTextStyle": "light",//组件上拉操作的加载效果,light/dark
    "navigationBarBackgroundColor": "#10c0e7",//窗口颜色(只能16进制格式)
    "navigationBarTitleText": "赣村优品",//窗口标题
    "navigationBarTextStyle": "black"//窗口字体,black/white
  },
  "tabBar": {
    "color": "#999999",//初始颜色
    "selectedColor": "#000",//选中时颜色
    "borderStyle": "white",
    "backgroundColor": "#fff",
    "list": [
      {
        "pagePath": "pages/index/index",
        "text": "首页",
        "iconPath": "static/image/tabbar/home.png",
        "selectedIconPath": "static/image/tabbar/home_sel.png"
      },
      {
        "pagePath": "pages/classify/index",
        "text": "分类",
        "iconPath": "static/image/tabbar/classify.png",
        "selectedIconPath": "static/image/tabbar/classify_sel.png"
      },
      {
        "pagePath": "pages/car/index",
        "text": "购物车",
        "iconPath": "static/image/tabbar/car.png",
        "selectedIconPath": "static/image/tabbar/q.png"
      },
      {
        "pagePath": "pages/my/index",
        "text": "我的",
        "iconPath": "static/image/tabbar/my.png",
        "selectedIconPath": "static/image/tabbar/my_sel.png"
      }
    ]
  },

app.js:方法,初始化数据

App({
data:{
})

app.wxss:全局样式

页面配置:

index.wxml:结构,组件化,每个标签都是一个组件,
index.js:行为,Page({})里配置当前页面
index.json:
index.wxss:样式
图片只能在硬盘里面放入,最好用绝对路径

上一篇 下一篇

猜你喜欢

热点阅读