html输入框只能扫描枪,vue.js 扫码枪 input 输入法问题

import { Observable } from "rxjs";

const Sdic = {

"1": "!",

"2": "@",

"3": "#",

"4": "$",

"5": "%",

"6": "^",

"7": "&",

"8": "*",

"9": "(",

"0": ")",

"-": "_",

"=": "+",

"[": "{",

"]": "}",

"\\": "|",

";": ":",

"'": '"',

",": "

".": ">",

"/": "?"

};

function IsLower(s: string) {

return s.toLowerCase() === s;

}

function GetShiftChar(cur: KeyboardEvent): string {

if (cur.keyCode >= 65 && cur.keyCode <= 90) {

return IsLower(cur.key) ? cur.key.toUpperCase() : cur.key.toLowerCase();

} else {

return Sdic[cur.key];

}

}

function GetStop(input: HTMLInputElement) {

const end$ = Observable.fromEvent(input, "compositionend");

const keyup$ = Observable.fromEvent(input, "keyup");

const enter$ = keyup$.filter(e => e.keyCode === 13);

return Observable.combineLatest(end$.merge(enter$), keyup$).debounceTime(250);

}

function GetLast(str: string) {

return str.substr(str.length - 1, 1);

}

export function GetInputSource(input: HTMLInputElement) {

const stop$ = GetStop(input);

return Observable.fromEvent(input, "keyup")

.scan(

(prev, cur) => {

// //汉字

// if (cur.keyCode === 231) {

// return {

// IsShift: false,

// key: GetLast(input.value)

// };

// }

return {

IsShift: cur.keyCode === 16,

key: prev.IsShift ? GetShiftChar(cur) : cur.key

};

},

{ IsShift: false, key: "" }

)

.map(t => t.key)

.filter(t => t != null && t.length === 1)

.bufferWhen(() => stop$)

.map(arr => arr.join("").trim());

}

class="form-control"

:readonly="readonly"

ref="input" />

class="btn btn-danger"

@click="clear">X

• :key="i"

  v-text="s">

import { GetInputSource } from '@/utils/Typeahead.ts';

const TRUE_RESULT = '123abc!@#$%^&<>;[]';

export default {

data() {

return {

value: '',

TRUE_RESULT,

list: []

}

},

computed: {

readonly() {

return this.value != null && this.value != '';

}

},

mounted() {

this.clear();

},

methods: {

init() {

const input = this.$refs.input;

this.sub && this.sub.unsubscribe();

this.sub = GetInputSource(input)

.takeWhile(() => !this.readonly)

.subscribe(this.add);

},

add(str) {

console.log(str);

console.log(str === TRUE_RESULT);

this.SetValue(str);

this.list.push(str);

},

async SetValue(val) {

this.value = val;

await this.$nextTick();

const input = this.$refs.input;

input.value = val;

input.focus();

},

clear() {

this.init();

this.SetValue('');

}

},

beforeDestroy() {

this.sub && this.sub.unsubscribe();

}

}