微信小程序 入门

Posted tony_zhu

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了微信小程序 入门相关的知识,希望对你有一定的参考价值。

目录结构:

  •  app.json  .小程序的全局配置 

  1. pages:  当前小程序所有页面路径。
  2. window:小程序所有页面的顶部背景颜色,文字颜色定义在这里。
  3. tabBar:  设置底部 tab 
  4. networkTimeout:设置网络超时时间
  5. debug:设置是否开启 debug 模式
  • project.config.json .工具配置(开发项目时的个性化配置)

  • app.js 小程序入口

组件:

  1.scroll-view   

   enable-back-to-top 属性在开发者工具中没有体现,手机预览有作用。

   style="height:{{windowHeight}}" 必须设置高度值不能用百分比,采用js获取视口高度 getSystemInfo函数

     js文件:wx.getSystemInfo({
        success: function (res) {
                self.setData({
                    windowHeight: res.windowHeight + "px",
               })
           }  
       })
 2.view
        列表循环实现:
<view wx:for="{{songList}}" wx:key="songName" class=‘flex-wrp bc_songList‘ style="background-color:{{index%2==0?‘‘:‘wheat‘}}"> //根据行号 动态生成行背景颜色
<view>
  <image style=‘width:32px;height:32px‘ mode="aspectFit" src="/static/icons/songList.png"></image>
</view>
<view>{{index+1}}.</view>
<view>{{item.songName}}</view>
</view>
框架:
    wx:if="{{item.play==false}}"   wx:else   //条件是true是false 一定要写(坑)
 
 
 

 

以上是关于微信小程序 入门的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序入门(四):页面数据展示

微信小程序入门介绍

微信小程序 | 49,小程序入门集锦系列文章20篇

微信小程序开发零基础入门——微信小程序入门

微信小程序开发小白零基础入门微信小程序入门建议收藏

天河微信小程序入门:阿里云tomcat免费配置https