微信小程序开发-项目基本结构&插值表达式&数据xxx自定义属性&setData（）方法

1、 项目目录组成

Pages目录：用于存储所有页面。

Utils目录：用于存储工具类文件。

app。js：它是入口文件。当程序运行时，应该首先执行它。

app。Json：它是一个全局配置文件，用于配置小程序的信息（它配置了全局信息）。

app。Wxss:全局样式文件。全局样式文件中定义的选择器将在所有页面中生效。

项目配置。Json:是项目配置文件。也可以通过详细信息-本地设置配置设置。

网站地图。json：它是SEO配置文件，方便用户搜索小程序。

2、 app。json文件配置

1.页面配置项

页面注册视图。它用于指定小程序由哪些页面组成。每个项目对应于页面的路径（包括文件名）信息。

“页面”：[

“页面/索引/索引”

]

2.窗口配置项

窗口：全局窗口配置。

backgroundTextStyle：设置文本样式（下拉式样式）。仅支持暗/亮。

NavigationBarBackgroundColor：设置导航栏的背景。

NavigationBarTitleText：设置导航栏文本。

NavigationBarTextStyle：设置导航栏标题颜色。仅支持黑白。

“窗口”：{

“backgroundTextStyle”：“浅”，

“navigationBarBackgroundColor”：“#fff”，

“navigationBarTitleText”：“Weixin”，

“navigationBarTextStyle”：“黑色”

}

3、 风格

样式：设置样式级别。默认值为v2。

“样式”：“v2”

4、 站点地图位置

SitemapLocation：表示json的站点地图位置；默认值为“sitemap Json”，即app中Json对等目录Json文件中名称的站点地图。

“站点地图位置”：“站点地图.json”

3、 页面组成

1.xxx。wxml文件

xxx。wxml文件相当于html文件。在wxml文件中，无法写入传统的html标签，只能写入微信提供的组件。以下是开发中的一些基本组件。

（1） 查看组件

它相当于HTML中的div标记。

热</view>

（2） 文本组件

相当于HTML中的span标记。

文本</text>

（3） 刮水器部件

滑动器是一个滑块视图容器，它只能包含滑动器项目组件。刮水器部件的常见特性：

圆形：是否采用粘性滑动

自动播放：是否自动切换

间隔：自动切换间隔

指示点：是否显示面板指示点

指示器颜色：指示器颜色

指示器活动颜色：当前选定指示器点的颜色

<刷卡项目>

<；/图像>

（4） 图像

图像是图片组件。最好使用所有网络图片，因为小程序的总容量不能超过2MB。

2.Xxx。wxss文件

xxx。wxss文件相当于css文件。在wxss文件中，最好不要编写标记选择器和id选择器，而是统一编写类选择器。

为了使小程序的内容能够在各种设备上自适应显示，微信引入了一个响应单元：rpx。在iphone6 6中，2rpx=1px。

宽度：60rpx；/*相当于宽度：30px*/

3.Xxx。js文件

xxx。js文件是一个交互式文件（核心文件）。

Page（）函数返回页面对象。此函数需要传递一个配置参数，该参数是一个对象。在此配置对象中，定义了当前页面的所有内容。

（1） 数据

定义页面的数据。

第页({

数据：{

名称：“流行歌曲”，

歌曲：[{

id:1001，

名称：“千里之外”

}, {

id:1002，

名称：“成都”

}]

}

})

（2） 自定义函数

开发人员可以将任何函数或数据添加到Object参数，可以在页面的函数中使用该参数进行访问。

第页({

//定义函数

delSong（）{

这是一首歌。接头（0，1）

this.set数据({

歌曲：this.data.songs

})

}

})

4.Xxx。json文件

xxx。json文件是页面的配置文件（使用当前页面信息配置）。用法与app相同。json。

{

“usingComponents”：｛｝，

“NavigationBarTitleText”：“主页”

}

4、 插值表达式

WXML中的动态数据来自相应页面的数据。插值表达式｛｛｝｝可用于显示js文件中数据中的数据。

1.获取数据中的数据内容

歌曲分类：｛｛name｝｝</text>

2.组件属性（需要在双引号内）

<；/视图>

3.关键词（需要在双引号内）

注意：不要直接写checked=“false”。计算结果i