【微信小程序】小程序代码基本组成结构
微信小程序代码基本组成结构
微信小程序是一种基于 JavaScript 的前端框架,用于开发移动端应用。小程序的代码基本组成结构包括以下几个部分:
1. 配置文件(config.json)
配置文件是小程序的入口文件,它定义了小程序的基本信息,如appid、secret等。
```json{
"pages": [
"index/index",
"logs/logs"
],
"window": {
"backgroundTextStyle": "light",
"navigationBarBackgroundColor": "fff",
"navigationBarTitleText": "",
"onReachBottomDistance":50,
"enablePullDownRefresh": true },
"tabBar": {
"list": [
{
"pagePath": "index/index",
"text": ""
},
{
"pagePath": "logs/logs",
"text": ""
}
],
"color": "000000",
"selectedColor": "000000",
"borderStyle": "black"
}
}
```
2. 页面文件(*.wxss)
页面文件是小程序的样式文件,它定义了页面的布局和样式。
```css/*index.wxss*/
page {
display: flex;
flex-direction: column;
align-items: center;
height:100vh;
}
.index {
width:750rpx;
height:200rpx;
background-color: f7f7f7;
}
```
3. 逻辑文件(*.js)
逻辑文件是小程序的业务逻辑文件,它定义了页面的交互逻辑。
```javascript//index.jsPage({
data: {
title: 'Hello World'
},
onLoad: function(options) {
console.log('onLoad')
}
})
```
4. 组件文件(*.wxml)
组件文件是小程序的模板文件,它定义了页面的结构和布局。
```html
```
5. 图片资源
图片资源是小程序的静态资源,用于展示图片。
```html