当前位置:网站首页>Small program introduction to proficient (2): understand the four important files of small program development
Small program introduction to proficient (2): understand the four important files of small program development
2020-11-06 20:37:00 【Tell me Zhan to hide】
1. The applet doesn't have DOM object , Everything is based on componentization
2. Four important files of the applet
- *.js —> view Logic —> javascript
- *.wxml —> view structure ----> html
- *.wxss —> view style -----> css
- *. json ----> view data -----> json file
Be careful : To facilitate developers to reduce configuration items , The four files that describe the page must have the same path and file name .
2.1 WXML
WXML(WeiXin Markup Language) Is the framework design of a set of tag language , combination Basic components 、 The event system , You can build the structure of the page .WXML
It's like HTML
Role
To fully understand WXML grammar , Please refer to WXML Syntax reference .
2.2 WXSS
WXSS (WeiXin Style Sheets) It's a style language , Used to describe WXML Component style .
WXSS Used to decide WXML How should components of .
In order to adapt to the vast number of front-end developers ,WXSS have CSS Most features . At the same time in order to more suitable for the development of WeChat applet ,WXSS Yes CSS It has been expanded and modified .
And CSS comparison ,WXSS The extended features are :
- Unit of measure
- Style import
2.3 json
JSON Is a data format , It's not a programming language , In the applet ,JSON Play the role of static configuration .
- Global configuration
In the applet root directory app.json
The file is used for global configuration of wechat applets , Determine the path of the page file 、 Window representation 、 Set network timeout 、 More settings tab etc. .
- Configuration page
Each applet page can also use the same name .json
File to configure the window representation of this page , Configuration items in the page will overwrite app.json
Of window
The same configuration item in .
- Tool configuration project.config.json
Usually when you use a tool , They will make some personalized configurations according to their preferences , For example, interface color 、 Compile configuration, etc , When you change to another computer and re install the tools , You have to reconfigure .
With that in mind , The applet developer tool generates a project.config.json
, Any configuration you make on the tool will be written to this file , When you re install tools or change your computer to work , You just load the code package of the same project , Developer tools automatically
Be careful :
JSON The documents are all wrapped in braces {}, adopt key-value How to express data .JSON Of Key Must be wrapped in a double quotation mark , In practice , To write JSON When , Forget to give Key It's a common mistake to use double quotes for values or single quotes for double quotes .
JSON The value of can only be in the following data formats , Any other format will trigger an error , for example JavaScript Medium undefined.
- Numbers , Contains floating-point numbers and integers
- character string , Need to wrap in double quotes
- Bool value ,true perhaps false
- Array , Need to be wrapped in square brackets []
- object , Need to wrap in braces {}
- Null
The other thing to note is that JSON Cannot use comment in file , An attempt to add a comment will result in an error .
2.4 js
It's not enough for a service to only display the interface , You also need to interact with users : Respond to user clicks 、 Get the user's location and so on . In the applet , We just wrote JS
Script files to handle user actions .
- Registration page
For each page in the applet , All need to be mapped on the page js
Register in the file , Specify the initial data for the page 、 Lifecycle Callback 、 Event handling functions, etc
- Use Page Constructor registration page
Simple pages can be used Page()
Construct .
- Use Component The constructor constructs the page
Page
The constructor works for simple pages . But for complex pages , Page
Constructors may not work well .
here , have access to Component
Constructors to construct pages . Component
The main difference between constructors is : Methods need to be placed in methods: { }
Inside .
版权声明
本文为[Tell me Zhan to hide]所创,转载请带上原文链接,感谢
边栏推荐
- Basic principle and application of iptables
- ado.net和asp.net的关系
- DC-1靶機
- Python filtering sensitive word records
- Application of restful API based on MVC
- C + + and C + + programmers are about to be eliminated from the market
- 01. SSH Remote terminal and websocket of go language
- 嘉宾专访|2020 PostgreSQL亚洲大会阿里云数据库专场:王涛
- 百万年薪,国内工作6年的前辈想和你分享这四点
- html+vue.js 實現分頁可相容IE
猜你喜欢
Diamond standard
Swagger 3.0 brushes the screen every day. Does it really smell good?
Using NLP and ml to extract and construct web data
C + + and C + + programmers are about to be eliminated from the market
It's easy to operate. ThreadLocal can also be used as a cache
Network security engineer Demo: the original * * is to get your computer administrator rights! [maintain]
【:: 是什么语法?】
PHP application docking justswap special development kit【 JustSwap.PHP ]
仅用六种字符来完成Hello World,你能做到吗?
文件过多时ls命令为什么会卡住?
随机推荐
小游戏云开发入门
C# 调用SendMessage刷新任务栏图标(强制结束时图标未消失)
C + + and C + + programmers are about to be eliminated from the market
代码生成器插件与Creator预制体文件解析
Staying up late summarizes the key points of report automation, data visualization and mining, which is different from what you think
(2) ASP.NET Core3.1 Ocelot routing
Analysis of ThreadLocal principle
Introduction to quantitative investment and Trading (Python introduction to financial analysis)
百万年薪,国内工作6年的前辈想和你分享这四点
Elasticsearch数据库 | Elasticsearch-7.5.0应用搭建实战
[efficiency optimization] Nani? Memory overflow again?! It's time to sum up the wave!!
Flink's datasource Trilogy 2: built in connector
Gather in Beijing! The countdown to openi 2020
Analysis of query intention recognition
Humor: hacker programming is actually similar to machine learning!
For a while, a dynamic thread pool was created, and the source code was put into GitHub
仅用六种字符来完成Hello World,你能做到吗?
What are Devops
嘉宾专访|2020 PostgreSQL亚洲大会阿里云数据库专场:曾文旌
DC-1靶機