用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

微客吧 首页 教程 微信小程序 新手教程 查看内容

微信小程序实现扫一扫,picker和range-key的用法

纸飞机 2018-3-6 16:10

一:实现扫一扫分享者:向往蓝天的飞鱼,来自原文地址 //index.js//获取应用实例 var app = getApp() Page({ data: { show: "", }, onLoad: function () { console.log('onLoad') }, cli ...

一:实现扫一扫

分享者:向往蓝天的飞鱼,来自

原文地址


//index.js

  1. //获取应用实例
  2. var app = getApp()
  3. Page({
  4. data: {
  5. show: "",
  6. },
  7. onLoad: function () {
  8. console.log('onLoad')
  9. },
  10. click: function () {
  11. var that = this;
  12. var show;
  13. wx.scanCode({
  14. success: (res) => {
  15. this.show = "--result:" + res.result + "--scanType:" + res.scanType + "--charSet:" + res.charSet + "--path:" + res.path;
  16. that.setData({
  17. show: this.show
  18. })
  19. wx.showToast({
  20. title: '成功',
  21. icon: 'success',
  22. duration: 2000
  23. })
  24. },
  25. fail: (res) => {
  26. wx.showToast({
  27. title: '失败',
  28. icon: 'success',
  29. duration: 2000
  30. })
  31. },
  32. complete: (res) => {
  33. }
  1. .saoma{
  2. height: 40px;
  3. width:110px;
  4. line-height: 40px;
  5. margin-left: auto;
  6. margin-right: auto;
  7. color: #fff;
  8. background-color: #999;
  9. text-align: center;
  10. }
  11. .show{
  12. width: 100%;
  13. color: #666;
  14. background-color: #fff;
  15. height: auto;
  16. }
  1. class="container">
  2. class="saoma" bindtap="click">点我扫一扫
  3. class="show">{{show}}

微信,真机测试通过

二:picker和range-key的用法

分享者:独鸣在彼岸,来自

原文地址

  1. bindchange="bindPickerChange" value="{{index}}" range="{{location}}" range-key="{{'name'}}">
  2. class="picker">
  3. 地州{{location[index]}}

range-key用于渲染picker的源是数组的情形,range-key制定了需要picker展示的内容。index是系统自动指定的array的下标,不用修改。

对应的数组内容如下:

  1. [{
  2. "id": "XM4xZnN088X5",
  3. "name": "西双版纳州"
  4. }, {
  5. "id": "yrw6F6n30igs",
  6. "name": "昆明市"
  7. }]

注意range-key中的字段需要单引号指定。

鲜花
鲜花
握手
握手
雷人
雷人
路过
路过
鸡蛋
鸡蛋
分享至 : QQ空间
收藏