06点击事件 tabBar配置 拨打电话

简介: 06点击事件 tabBar配置 拨打电话

1==  D:\wxxm  项目的地址


2==》tabBar在全局配置中


在pages的同级目录下创建images本地图标 (最好的是在远程获取img 因为微信是有大小限制的)


selectedIconPath=======================>是点击选中时候展现的图标


"iconPath":"images/home-off.png",=====>是默认时候的图标


其中 list 接受一个数组,只能配置最少 2 个、最多 5 个 tab。tab 按数组的顺序排序,每个项都是一个对象,其属性值如下:


在app.json中去配置


 "tabBar": {
      "list": [
        { 
          "selectedIconPath":"images/home-on.png",
          "iconPath":"images/home-off.png",
          "pagePath": "pages/index/index",
          "text": "首页"
        },
        {
          "selectedIconPath": "images/kefu-on.png",
          "iconPath": "images/kefu-off.png", 
          "pagePath": "pages/logs/logs",
          "text": "日志"
        },
        {
          "selectedIconPath": "images/pengyoufill.png",
          "iconPath": "images/pengyou.png",
          "pagePath": "pages/person/person",
          "text": "我的"
        }
      ]
  }


就会出现图标


 ps==>app.json中不能有注释(重点)


 注意你新创建的页面是否有在App.json有注入路由


03==>绑定点击事件


<view id="tapTest" data-hi="WeChat" bindtap="tapName"> 绑定点击事件 bindtap Click me! </view>


//  事件
tapName: function (event) {
    console.log(event);//会有很多的东西在这里里面的哦
}   


04==》拨打电话


<button  bindtap="tel">点击拨打电话</button>


// 点击拨打电话
tel(){
  wx.makePhoneCall({
    phoneNumber: '18383841503' //仅为示例,并非真实的电话号码
  })
}


拿到这个点击元素的所有数据


1425695-20191017204236306-601398161.png

1425695-20191017204307411-1297931407.png


相关文章
|
小程序 JavaScript
微信小程序自定义底部tabBar按钮
微信小程序自定义底部tabBar按钮
168 0
|
Android开发
autojs修改悬浮窗按钮点击事件
牙叔教程 简单易懂
1280 0
|
5月前
4.Electron之自定义菜单(绑定快捷键、点击事件)
4.Electron之自定义菜单(绑定快捷键、点击事件)
608 1
|
小程序 JavaScript
微信小程序 - 监听 TabBar 切换点击事件
微信小程序 - 监听 TabBar 切换点击事件
1537 0
|
Android开发 数据安全/隐私保护 开发者
ApeForms | C#WinForm弹出简易的消息提示框 (仿Android Toast消息提示)
在使用手机的时候经常会见到屏幕的中下方会弹出消息提示框,它就是Toast。 ApeForms中也实现了非常简洁易用Toast,与Android的Toast不同的是,ApeForms允许开发者设置不同的弹出模式。此外还针对PC端有鼠标的情况进行了改进,当鼠标悬停于消息弹出框之上时弹出框不会消失。
429 0
ApeForms | C#WinForm弹出简易的消息提示框 (仿Android Toast消息提示)
|
XML 存储 缓存
底部导航栏的几种实现方式
底部导航栏的几种实现方式
331 0
|
iOS开发
iOS开发 - 解析tabbar中的凸起按钮
iOS开发 - 解析tabbar中的凸起按钮
406 0
iOS开发 - 解析tabbar中的凸起按钮
|
JavaScript 前端开发 Android开发
Vue中 监听移动端软键盘弹出、收起事件
Vue中 监听移动端软键盘弹出、收起事件
1577 0
|
Android开发
Android 仿美团悬浮购物车显示隐藏
Android 仿美团悬浮购物车显示隐藏
334 0
Android 仿美团悬浮购物车显示隐藏