sk-comp-keyboard v0.0.2

全渠道虚拟键盘组件,可用于验证码输入,金额输入等

sk-comp-keyboard

• category: UI
• chinese: 图标
• type: UI组件

API

--

注意

小数点后最多输出两位,否则建议直接使用onBtnPress来进行自行封装输出数据.

--

使用demo

/** @jsx createElement */
import {createElement, Component,render } from 'rax';
import {View,Text} from 'nuke';
import NukeBizTest from 'sk-comp-keyboard';

let App = class NukeDemoIndex extends Component {
    constructor() {
        super();

        this.state = {
            value: '',
            priceValue: '',
        }
    }
    onInput(obj){
    console.log(obj);
        this.setState({
            value: obj.num,
            priceValue: obj.showNum
        })
    }
    render() {
        return (
            <View>
                <View>
                    <Text>验证码:{this.state.value}</Text>
                    <Text>金额:{this.state.priceValue}</Text>
                </View>
                <View style={styles.keyboardStyle}>
                    <NukeBizTest onInput={(obj) => this.onInput(obj)} wrapperStyle={styles.keyboardStyle} />
                </View>
            </View>
        );
    }
}
const styles={
    btnWithMargin:{
        marginTop:'30rem',
        marginBottom:'50rem',
        marginLeft:'42rem',
        marginRight:'42rem'
    },
    btnLine:{
        marginTop:'30rem',
        marginBottom:'50rem',
        paddingLeft:'42rem',
        paddingRight:'42rem' //#1170bc;
    },
    keyboardStyle: {
        width: '750rem'
    }
}
render(<App/>);