小程序基础总结

根目录文件代码结构解析

---

最外层单独文件：

.app.js文件

设置一些全局的基础数据等

app.json文件

底部tab, 标题栏和路由等设置；
“page”:{} 这个相当于路由
“window”：{} 小程序窗口一些设置，例如：标题修改，颜色风格，背景颜色风格
“tobar”：{} 设置导航按钮

app.wxss文件

公共样式，引入iconfont等
以iphone6为标准，，单位是rpx

project.config.json文件

项目配置文件，用得最多的就是配置是否开启https校验

sitemap.json

设置页面是否可以索引，，
设置否后，搜索搜不到页面的内容，具有安全保密作用

---

pages文件夹：

里面包含一个个具体的页面
1.这个文件夹放：路由指定的一些，页面模块。
2.这些文件包含：js，json，wxml，wxss文件

---

wxml常用标签

1. view 这个标签相当于div(它的特点就是在没有其他样式影响的情况下，宽度100%)；
2. text 这个标签相当于span(它的特点就是在没有其他样式影响的情况下，不会独占一行，宽和高由内容撑开，这个时候你设置宽高是没有用的)；
3. image 这个标签比较重要，图片组件。src里面可以放网络地址和本地图片地址。
4. button 这个是按钮组件。
5. input 这个是输入框组件。

修改data数据

需要this.setData()

常用指令：

wx:for循环
bindtap绑定事件
data-index=“绑定属性或参数”

---

生命周期

onLoad() 页面加载时触发，只会调用一次，可获取当前页面路径中的参数。
onShow() 页面显示/切入前台时触发，一般用来发送数据请求；
onReady() 页面初次渲染完成时触发, 只会调用一次，代表页面已可和视图层进行交互。
onHide() 页面隐藏/切入后台时触发, 如底部 tab 切换到其他页面或小程序切入后台等。
onUnload() 页面卸载时触发，如redirectTo或navigateBack到其他页面时。

---

跳转页面：

wx.navigateTo({
      url: '../logs/logs?title="标题"'
 })

第一：获取参数页面
在onLoad里的options拿到

  onLoad: function (options) {
    let title = JSON.parse(options.title)
    console.log(title)
  },

第二：获取参数，利用缓存 有10兆

wx.setStorageSync('title', '缓存带过来的') 
var title = wx.getStorageSync('title')

第三：全局数据
可以写在app.js文件里的globalData：{}。
例子：
app.js页面：

globalData: {
    userInfo: null,
    title:'我是全局数据'
  }

使用数据页面：

//获取应用实例
const app = getApp()
//然后使用：
app.globalData.title

---