知识分享
分享创造价值 合作实现共赢

知识分享

当前位置: 首页 > 知识分享

微信小程序文件结构

发布时间:2021-10-06 12:54:16作者:顺晟科技点击:

app.js——小程序逻辑,通常执行一些初始化的工作,例如获取用户信息,地址等授权

app.json——小程序公共配置,放置一些公共参数,例如页面的路径

app.wxss——小程序公共样式表,定义一些全局样式

 

一个小程序页面由4个文件组成,所以要创建一个小程序页面,至少包含下面两个文件的组成部分:

page.js——(必需)实现页面的逻辑,例如点击事件等

page.wxml——(必需)页面的结构,相当于页面的内容

page.json——(非必要)页面的配置,例如导入一些插件,页面的标题等

page.wxss——(非必要)页面的样式,页面的样式可以直接写在page.wxml里面,不过会显得页面臃肿,比较推荐还是写在wxss文件里面

 

app.json详解

属性配置:

  entryPagePaht——配置启动页,非必填,如果不配置默认pages列表的第一项为启动页

    

  pages——页面路径,每个页面的路径

    

  window——设置小程序的状态栏,导航条,标题等属性

    navigationBarBackgroundColor——导航栏背景颜色

    navigationBarTextStyle——导航条标题颜色,只有white和black两种

    navigationBarTitleText——导航条标题文字内容

    navigationStyle——导航条的样式设置,只有default默认样式和custom自定义样式,自定义样式需要兼容低版本

    backgroundColor——窗口的背景颜色

    backgroundTextStyle——下拉loading的样式,只有dark和light两种属性

    backgroundColorTop——顶部窗口的背景颜色,只支持ios

    backgroundColorBottom——底部窗口的背景颜色,只支持ios

    enablePullDownRefresh——是否开启全局的下拉刷新

    onReachBottomDistance——页面上拉触底事件触发时距页面底部距离,单位为 px。

    pageOrientation——屏幕旋转设置,只有auto,portrait和landscape三个属性选择

      

  tabBar——底部或顶部有 tab 栏可以切换页面,可以通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。

    

TOP

QQ客服

18910140161