微信-文件组成-模块作用--定义全局方法变量---数据绑定--wx:for循环列表

app.js

//app.js
console.log("==========================================")
//1.小程序不是运行在浏览器中的，所以没有Bom,Dom 对象
//console.log(window)=>undefined
//console.log(document)=>undefined

//2.小程序的js有一些额外的成员
//App方法 用于定义应用程序实例对象
//Page 方法 用于定义页面对象
//getApp 方法 用来获取全局应用程序对象
//getCurrentPages 方法 用来获取当前页面的调用栈-也就是访问的页面记录，最后一个就是当前页面
//wx 对象 用来提供核心API的

//3.小程序的js是支持CommonJS规范的
const foo = require('./utils/foo.js')
foo.say('world')
console.log("==========================================")

foo.js

function say(msg){
  console.log('Hello'+msg)
}
//导出say方法
module.exports = {
  say:say
}

　　index.wxml

<!--index.wxml-->
<!-- 基于xml语言，用来定义页面结构单标签也也结束例如image-->
<view class="container">
  <text>{{message}}</text>
  <text>{{perssion.name}}</text>
  <text>{{perssion.age}}</text>
  <view class=" style1 {{viewClassname}}"></view>
  <!-- mestach语法可以用在以上，不能用于定义标签名和属性名-->
  <!--可以直接使用字面量和简单的逻辑运算符-->
  
  <!--列表渲染-->
  <!--起别名wx:for-item="别名"-->
  <view>
    <view wx:for="{{ todos }}">
    <text>{{ index }}</text>
    <checkbox checked="{{ item.completed }}"></checkbox>
    <text>{{ item.name }}</text>
    </view> 
  </view>
</view>

index.js

//index.js
//获取应用实例
const app = getApp()

Page({
  //为页面提供数据的
  //data就是界面和逻辑之间的桥梁
  data:{
    message:"Hello world",
    perssion:{
      name: "zhangsan",
      age: 12
    },
    viewClassname:"hello",
    todos:[
      { name: 'javascript', completed:false },
      { name: 'html', completed: true },
      { name: 'css', completed: false }
    ]  
    
  }

})