微信小程序常用知识-基础篇

一、事件绑定

        bindtap

 <button class="weui-btn" type="default" bindtap="openConfirm">Confirm Dialog</button>
 <button class="weui-btn" type="default" bindtap="openAlert">Alert Dialog</button>

二、样式导入

        @import

@import 'style/weui.wxss';

三、列表渲染

        wx:for

Page({
  items: [{
    message: 'foo',
  },{
    message: 'bar'
  }]
})

<view wx:for="{{items}}" wx:for-index="index" wx:for-item="item">
  {{index}}: {{item.message}}
</view>

        block wx:for

<block wx:for="{{[1, 2, 3]}}">
  <view> {{index}}: </view>
  <view> {{item}} </view>
</block>

四、模块化

定义：

// common.js

function sayHello() {
    console.log("hello");
}

module.exports = {
   sayHello:sayHello
}

引用：

//index.js

const common = require("../../utils/common.js");

function say() {
    common.sayHello();
}

五、8大组件

1.  视图容器
2.  基础内容
3.  表单组件
4.  操作反馈
5.  导航
6.  媒体组件
7.  地图
8.  画布

六、三个文件

1. app.js
2. app.json
3. app.wxss