Digital Keyboard:无依赖、多类型、高质量的移动端数字键盘

2019阿里云全部产品优惠券(好东东,强烈推荐)
领取地址 https://promotion.aliyun.com/ntms/yunparter/invite.html

推荐:跨平台移动开发phonegap/cordova 3.3全系列教程-helloworld

[1.    建立专案(cordova)打开cmd命令行cordova create ACESMobile aces.mobile ACEScd acesmobile如图2.    安装插件cordova pluginadd命令需要您指定的外掛程式代碼的存

Digital Keyboard

中文README

  • Develop with native javascript, doesn't rely on any frameworks and libraries.
  • Support ID card, mobile number, integer, decimal, etc.
  • Easy API, easy use.
  • Development summary: How to release a Digital Keyboard npm package .

Type

decimal

推荐:[移动] Android推送方案分析(MQTT/XMPP/GCM)

[本文主旨在于,对目前Android平台上最主流的几种消息推送方案进行分析和对比,比较客观地反映出这些推送方案的优缺点,帮助大家选择最合适的实施方案。方案1、使用GCM服务

integer/phone

idcard

PropTypes

Property Type Default Description
el DOM parent node
type String decimal decimal,integer,phone,idcard
inputValue Function return keyboard value

Getting Started

Install

yarn add digital-keyboard --dev

Usage Example

  • Native JavaScript
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="author" content="simbawu">
  <title>Digital Keyboard</title>
</head>
<body>
  <div id="values"></div>
  <div id="app"></div>
  <script src="./digitalKeyboard.js"></script>
</body>
</html>
//digitalKeyboard.js
import DigitalKeyboard from 'digital-keyboard';

function inputValue(value){
  console.log(value); //DigitalKeyboard return value
  document.querySelector('#values').innerHTML = value;
}

new DigitalKeyboard(
    {
        el: document.querySelector('#app'), 
        type: 'idcard', 
        inputValue: inputValue
    }
);
  • React
import React from 'react';
import DigitalKeyboard from "digital-keyboard";
class KeyboardPage extends React.Component {

  constructor(){
    super();

    this.inputValue = this.inputValue.bind(this);
    this._renderKeyboard = this._renderKeyboard.bind(this);
  }

  componentDidMount(){
    this._renderKeyboard();
  }
    
  inputValue(value){
    console.log(value); //DigitalKeyboard return value
  }

  _renderKeyboard(){
    return new DigitalKeyboard (
      {
        el: this.refs.digitalKeyboard,
        type: 'number',
        inputValue: this.inputValue
      }
    );
  }

  render(){
    return (
      <div ref='digitalKeyboard'></div>
    )
  }
}

export default KeyboardPage;
  • Vue
<template>
  <div></div>
</template>
<script>
import DigitalKeyboard from "digital-keyboard";
export default {
  mounted () {
    this._renderDigitalKeyboard();
  },
  methods: () {
    _renderDigitalKeyboard() {
    	return new DigitalKeyboard (
          {
            el: this.$el,
            type: 'number',
            inputValue: this.inputValue
          }
        );
    },
     
    inputValue(value) {
      console.log(value); //DigitalKeyboard return value
    }
  }
}
</script>

How to Contribute

Anyone and everyone is welcome to contribute to this project. The best way to start is by checking our open issues , submit a new issues or feature request , participate in discussions, upvote or downvote the issues you like or dislike.

License

The MIT License .

推荐:iOS开发26:UIImageView常用操作

[iOS开发26:UIImageView常用操作]

相关推荐