/**
* 微信小程序 笔记
*/
1.文件结构
微信小程序 官方给与的结构为：
projectName
pages
index
index.js
index.wxml
app.js
app.json
这里重点看一下，app.json
{
"pages": [
"pages/index/index"
],
"window": {
"navigationBarTitleText": "Demo"
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
"debug": true
}
这里的pages 就是设置 访问页面的顺序。这里强调一下，此配置项为顺序加载。
在这里为适应实际开发需要，修改了app.json 文件及文件目录。
projectName
eapdomain
src
pages
index
index.js
index.wxml
app.js
app.json
app.json 修改为
{
"pages": [
"eapdomain/src/pages/index/index"
],
"window": {
"navigationBarTitleText": "Demo"
},
"networkTimeout": {
"request": 10000,
"downloadFile": 10000
},
"debug": true
}
前台显示成功。
2.渲染
这里渲染主要是通过创建对应页面的wxml文件和js文件进行实现。在这里强调一下，对于一个页面来说wxml文件和js文件为必须存在的对于json文件和wxss文件为可选文件。
3.模板加载
1）创建wxml 模板文件
eg:
<text>this is head template file</text?
通过 include 的方式引入
2）创建wxml 模板文件 使用template 标签进行调用
eg:
<template name="head">
<text>this is head text</text>
</template>
<template name="footer">
<text>this is footer text</text>
</template>
前台文件 使用
<import src="../template/template1"/>
<template is ="head"/>
模板数据传递：在模板文件中对应的模板标签 定义显示的变量
<template name="footer">
<text>footer text:{{text}}</text>
</template>
前台调用时设置 template 的 data属性
<template is ="footer" data="{{text:showView}}"/>
本文出自 “洛山红茶的成长” 博客，请务必保留此出处http://85608547.blog.51cto.com/2093443/1918304