微信小程序相关

切换tab

wxml

<!-- 注意每个tab要绑定同一个事件 -->
<view style="display:flex;justify-content:space-between">
  <view class="{{activeType == 1 ? 'active' : ''}}" data-type="1" bindtap="click">tab1</view>
  <view class="{{activeType == 2 ? 'active' : ''}}" data-type="2" bindtap="click">tab2</view>
  <view class="{{activeType == 3 ? 'active' : ''}}" data-type="3" bindtap="click">tab3</view>
</view>

js

 data: {
   activeType: 1
 },
 click(e) {
   this.setData({
     activeType: e.currentTarget.dataset.type
   })
 },

css

.active {
  border-bottom: 1px solid pink;
}

---

数组点击item删除

wxml

<!--点击某item 删除数组中的这项 -->
<view wx:for="{{list}}" wx:key="id">
  <view>{{item.name}}
    <button size="mini" bindtap="del" data-delIndex="{{index}}">删除</button>
  </view>
</view>

js

  data: {
    list: [ { id: 1,name: 'rose'},
	 		{ id: 2,name: 'jack'},
     		{ id: 3,name: 'king'},
     	  ]},
   	 del(e) {
		    wx.showModal({
		      title: '提示',
		      content: '真的要删除吗',
		      success: res => { //注意使用箭头函数
		        if(res.confirm) {  this.data.list.splice(e.currentTarget.dataset.delindex,1); //注意大小写 
		          this.setData({
		            list : this.data.list
		          })
		        }
		      }
		    })
  },

模块封装

utils > common.js

// 使用时直接 import { $get } from '.....common.js'
export function $get(url,data) {
  return new Promise((resolve,reject) => {
    wx.request({
      url,
      data,
      method: 'GET',
      success: res => {
        // ...
        resolve(res.data)
      }
    })
  })
}

//es6 导入：import {xx}/.. from .. 没加default(一个页面只能有一个default)就可以使用解构导入 export function xx{}；加了default 直接 import 文件名 导入
// export default {
//   get
// }

//commonjs 
// module.export = {}
// let util = require('..')

---

位置获取