圖標(biāo)用自定義的，并且點(diǎn)擊整個(gè)按鈕區(qū)域都能跳轉(zhuǎn)微信客服

第一步：在按鈕中放N個(gè)contact-button標(biāo)簽，盡量鋪滿容器，按鈕用relative定位，contact-button用absolute定位

第二步：將contact-button樣式設(shè)置純透明 opacity: 0;(o゜▽゜)o☆[BINGO!]

微信小程序提供的模板，如果有數(shù)據(jù)或者事件必須在每個(gè)模塊單獨(dú)寫入。比如我們的產(chǎn)品經(jīng)理非要自己實(shí)現(xiàn)header模塊，而且header模塊還有下來菜單。如果每個(gè)模塊都有這個(gè)header，下來菜單的執(zhí)行操作每個(gè)頁面都要寫一遍很麻煩。

如下：

我的解決辦法是寫一個(gè)公共的wxml文件，一個(gè)公共的header.js。通過include wxml插入每個(gè)模塊的頁面，通過require(headerjs)為每個(gè)模塊強(qiáng)制注入 data和 事件函數(shù)

/**header.js**/
function init(){
  var that = this ;
  //header中相應(yīng)的數(shù)據(jù)
  that.setData({
      logo: '../../img/logo.png',
      a:""
  }) ;
  
  //header中相應(yīng)的 操作
  that.a = function(event){
   
  } ;

  that.b = function(event){
    
  }

  that.c = function(event){
    
  }
} ;
module.exports = {
  init: init
} ;
  

<!--在other.wxml模塊引入header.wxml-->
<include src="../include/header.wxml"/>
  

/**在other.wxml模塊引入header.js**/
var header = require('../include/header.js');
Page({
  data:{

  },
  onLoad:function(options){
    header.init.apply(this,[]);// this關(guān)鍵字必須傳進(jìn)去 這樣才能使header.js中的數(shù)據(jù)和函數(shù)注入到這個(gè)模塊
  }
})