微信小程序的wxml、wxss、js、json的理解

微信小程序的基础学习(2)
小程序的有些语言，有时候按照官方的解释来理解非常的吃力，会把初学者搞得很懵很难受，不知道从何下手！
文件夹下四个文件的理解：

文件	中文解释（个人理解）
.wxml	小程序页面视图 例如人的脸
.wxss	小程序页面视图修饰 例如修饰人脸的胖瘦肤白
.js	小程序逻辑层 例如人脸的神经，其作用就是控制整个人脸的运行
.json	小程序全局配置 其作用配置导航栏的文字、背景颜色、页面底部tabbar等

wxml----小程序的脸面
官方解释：WXML（WeiXin Markup Language）是框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。

wxml小程序的脸面，顾名思义展示在我们眼前的页面结构。


wxss----修饰wxml内容的胖瘦肤白
官方解释：WXSS (WeiXin Style Sheets)是一套样式语言，用于描述 WXML 的组件样式。

wxss为wxml的理发整容师；wxml与wxss交流是通过class实现的。



js----小程序的逻辑层

js小程序与数据库、服务器交换信息,控制wxml显隐的”神经中枢"；wxml与js的沟通方式主要为事件的触发与加载。

什么是事件
事件是视图层到逻辑层的通讯方式。
事件可以将用户的行为反馈到逻辑层进行处理。
事件可以绑定在组件上，当达到触发事件，就会执行逻辑层中对应的事 件处理函数。
事件对象可以携带额外信息，如 id, dataset, touches。
演示样例：



json----微信小程序的全局配置/页面配置

json小程序的全局配置与页面配置；json配置页面导航栏（小程序页面顶部）、tabbar（小程序页面底部）等
演示样例：

json源代码：

“window”: {
“backgroundColor”: “#fad81e”,
“backgroundTextStyle”: “light”,
“navigationBarBackgroundColor”: “#fad81e”,
“navigationBarTitleText”: “锦琅设计”,
“navigationBarTextStyle”: “black” }, “tabBar”: {
“selectedColor”: “#fbc663”,
“list”: [
{
“pagePath”: “pages/index/index”,
“text”: “主页”,
“iconPath”: “/image/index_1.png”,
“selectedIconPath”: “/image/index_2.png”
},
{
“pagePath”: “pages/personal/personal”,
“text”: “我的”,
“iconPath”: “/image/my_1.png”,
“selectedIconPath”: “/image/my_2.png”
}
] },

微信小程序的学习绝不是一朝一夕能够完成的，需要花更多的时间来打磨与练习。

本人自己做了一个完整的图文分享、点赞、收藏云开发小程序，可以用来做毕业设计、图文分享项目，操作简单，利用腾讯免费赠送的云开发空间就可以完成所有操作，节省成本、方便快捷，当天就可以上线！
链接：https://download.csdn.net/download/weixin_52658156/20238876