"api工厂" 使用手册

api接口开箱即用,云后台管理,助力前端,解放后端开发;

不懂编程也能独立开发应用,小步快跑,快速创业!

旨为更懂你!

查条码Demo

前言


本教程是基于 “apifm-wxapi” 模块,教你快速实现小程序开发,所以你可能需要先了解以下知识点:


《创建 HelloWorld 项目》

《使用 “apifm-wxapi” 快速开发小程序》

《免费注册开通后台,获得专属域名》


功能说明


任何商品的外包装上都有一个条形码;

本例演示如何快速实现输入条形码查询商品信息;


小程序实现


效果演示



wxml代码


 1<view class="page">
 2  <view class="page__bd">
 3    <view class="weui-cells__title">商品条码查询</view>
 4    <view class="weui-cells weui-cells_after-title">
 5      <view class="weui-cell ">
 6        <view class="weui-cell__hd">
 7          <view class="weui-label">条码</view>
 8        </view>
 9        <view class="weui-cell__bd">
10          <input class="weui-input" placeholder="请输入条码" bindinput="barcodeChange" />
11        </view>
12      </view>
13    </view>
14
15    <view class="weui-btn-area">
16      <button class="weui-btn" type="primary" bindtap="queryBarcode">查询</button>
17    </view>
18  </view>
19</view>


js代码


 1const WXAPI = require('apifm-wxapi')
 2WXAPI.init('gooking')
 3
 4Page({
 5  data: {
 6    barcode: undefined
 7  },
 8  onLoad: function (options) {
 9
10  },
11  onShow: function () {
12
13  },
14  barcodeChange(e){
15    this.data.barcode = e.detail.value
16  },
17  queryBarcode() { // 查询条码
18    if (!this.data.barcode){
19      wx.showToast({
20        title: '条码不能为空',
21        icon: 'none'
22      })
23      return
24    }
25    WXAPI.queryBarcode(this.data.barcode).then(res => {
26      console.log(res)
27      if (res.code == 0) {
28        wx.showToast({
29          title: '查询成功',
30          icon: 'success'
31        })
32      } else {
33        wx.showToast({
34          title: res.msg,
35          icon: 'none'
36        })
37      }
38    })
39  }
40})


WXAPI.init('gooking')  这句代码是将你的小程序链接到你的后台,其中  gooking 这个是你的专属域名(请查看前言中关于专属域名的章节说明);


利用小程序的扫码api,你可以轻松实现调用微信扫码接口实现快速扫码读取条形码继而查询


拓展:


利用该功能,你可以尝试着开发一款基于商品条码的进销存、出入库类小程序,记得和大家一起分享哦~


期待你的进步!

感谢!

Copyright © 杭州于芯科技有限公司

浙ICP备15041833号