'Nuxt - Virtual touch keyboard (vue-touch-keyboard)
I'm having some problems with the virtual keyboard vue-touch-keyboard, using Nuxt and Vue.
I'm using the same code as given in the example, but for some reason my page doesn't load (just keeps loading). Code is compiled successfully and I can't see any errors in the console.
I would appreciate any feedback or just a tip how to debug this problem.
<template>
<div>
<input type="text" placeholder="Text input" @focus="show" data-layout="normal" />
<vue-touch-keyboard :options="options" v-if="visible" :layout="layout" :cancel="hide" :accept="accept" :input="input" />
</div>
</template>
<script>
import VueTouchKeyboard from "vue-touch-keyboard";
import style from "vue-touch-keyboard/dist/vue-touch-keyboard.css"; // load default style
Vue.use(VueTouchKeyboard);
export default {
data: {
visible: false,
layout: "normal",
input: null,
options: {
useKbEvents: false,
preventClickEvent: false
}
},
methods: {
accept(text) {
alert("Input text: " + text);
this.hide();
},
show(e) {
this.input = e.target;
this.layout = e.target.dataset.layout;
if (!this.visible)
this.visible = true
},
hide() {
this.visible = false;
}
}
}
</script>
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
