前提・実現したいこと
現在vue(Nuxt)のプロジェクト内でプラグインを使用し、キーボードを表示させようとしています。
その中で、コンポーネントのpropsにクウォート'
、ダブルクウォート "
を渡したい(キーボード上に表示させたい)のですが、props内で以下のようなエラーが発生してしまいます。
上記エラーを回避するために、vueのprops内でもエスケープなどを使用して'
や "
を表示することはできるのでしょうか。
使用しているプラグインは以下です。
vue-keyboard
https://github.com/martywallace/vue-keyboard
なにか方法がございましたらご教授いただけますと幸いです。
よろしくお願いいたします。
発生している問題・エラーメッセージ
該当のソースコード
コンポーネント部分のみ載せています。
javascript
1<vue-keyboard 2 v-if="keyboard.kiosk" 3 v-model="kiosk" 4 :layouts="[ 5 '1234567890{delete:backspace}|qwertyuiop|asdfghjkl|{shift:goto:1}zxcvbnm|{Enter:custom}', 6 '||{{}}'!#$%&()*+,-./|:;<=>?@[]^_`~{delete:backspace} 7 |QWERTYUIOP|ASDFGHJKL|{shift:goto:0}ZXCVBNM|{Enter:custom}' 8 ]" 9 :maxlength="3" 10 @custom="checkKioskError" 11/>
試したこと
最初|
や{}
も表示できませんでしたが、ドキュメントで以下を発見しました。
You can use the pipe |, open curly brace { or close curly brace } characters in your keyboard by doubling up, e.g. <keyboard layouts="||{{}}"></keyboard> Will output a keyboard with the characters |{}.
同様の方法でもしかしたらできるかもしれないと思い試してみましたが、エラーが出てしまいました。
補足情報(FW/ツールのバージョンなど)
今回の質問に関連する部分のみ載せています。
"nuxt": "^2.4.2", "vue-keyboard": "^3.1.0",
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2019/05/28 05:32
2019/05/28 05:47 編集
2019/05/28 05:57