0606 微信小程序 (小程序架构构成 布局 事件)

1 微信小程序由主app单例+分页面结构构成

    APP 单列包含 (.wxml .js  .json  [三个文件必须文件类型,等同 html js(全局逻辑)  json(全局配置)三个格式]  .wxss [可选的文件类型.页面样式描述.等同 css] 

   分页结构 page -page[n] 

           分页也包含 (page+.wxml(页面布局)   page+.js(页面逻辑)    page+ .json(页面配置)  
           [三个文件必须文件类型,等同 html  js  json三个格式 +表示当前文件的序号]

            page+.wxss [可选的文件类型.页面样式描述.等同 css] 

2 各文件最简单的样式(空白项目使用微信默认模板初始化化后已经携带了基础功能,所以  有 点 蒙  逼.下面看个页面最简单的样式,并且是能跑起来的样式

        2.1.最简单一个app.js 内容如下:

            //app.js

var data={};
App({data});

           2.2  最简单的页面 page所包含的各内容如下:

            // index.js最简内容

              var param = {
                    data: { mytext: 'Hello World', }  //mytext可以用在
                                   };

//创建一个页面 注册一个页面 ,param里面带有参数

//这个参数会传到index.wxml中,将会用param.data.mytext替换index.wx
//ml中的mytext变量内容

        Page(param); //注册该页面

 

<!--index.wxml--内容
<view class="c1">  //c1样式类型写在index.wxss中
    <text class="t1">  //t1样式类型写在index.wxss中
         {{mytext}}  mytext变量引用,在index.js中定义并赋值的
     </text>
</view>

              

       

猜你喜欢

转载自www.cnblogs.com/xfym888/p/9144387.html