Uncaught TypeError: Cannot read property 'getContext' of undefined
翻訳結果
捕捉されないTypeError:未定義のプロパティ 'getContext'を読み込めません
これはgetContextを定義したら読み込めますよということですか?
この定義の仕方はどうすればいいですか?
<template> <div class="qrReader"> <qrcode-reader @init="onInit" @decode="onDecode"></qrcode-reader> </div> </template> <script lang="ts"> import Vue from 'vue'; import { AccountHttp, MosaicHttp, NamespaceHttp, MosaicService, Address, PublicAccount, PlainMessage, TransactionHttp, SimpleWallet, Password, NetworkType, NetworkCurrencyMosaic, AggregateTransaction, Account, TransferTransaction, Deadline } from 'nem2-sdk'; import Nem2Client from '../libs/Nem2Client'; import settingModel from '@/libs/settingModel'; import { QrcodeReader } from 'vue-qrcode-reader'; export default { components: { QrcodeReader }, name: "qrReader", data: () => ({ nem: new settingModel(), qrJson: '', isLoading: false, rules: { senderAddrLimit: (value: string) => (value && (value.length === 46 || value.length === 40)) || '送金先アドレス(-除く)は40文字です。', senderAddrInput: (value: string) => { const pattern = /^[a-zA-Z0-9-]+$/ return pattern.test(value) || '送金先の入力が不正です' }, amountLimit: (value:number) => (value >= 0) || '数量を入力してください', amountInput: (value:string) => { const pattern = /^[0-9.]+$/ return (pattern.test(value) && !isNaN(Number(value))) || '数字の入力が不正です' }, messageRules: (value:string) => (value.length <= 1024) || 'メッセージの最大文字数が超えています。' } }), methods: { async onInit (promise: any) { // show loading indicator try { await promise // successfully initialized } catch (error) { if (error.name === 'NotAllowedError') { // user denied camera access permisson } else if (error.name === 'NotFoundError') { // no suitable camera device installed } else if (error.name === 'NotSupportedError') { // page is not served over HTTPS (or localhost) } else if (error.name === 'NotReadableError') { // maybe camera is already in use } else if (error.name === 'OverconstrainedError') { // passed constraints don't match any camera. Did you requested the front camera although there is none? } else { // browser is probably lacking features (WebRTC, Canvas) } } finally { // hide loading indicator } }, onDecode(content: any){ // とりあえず呼ばれているか確認 console.log(content) // if (content !== '') { let qrJson = JSON.parse(content) console.log(qrJson) console.log(qrJson.data.msg) this.sendMultisig(qrJson) } this.$router.push({name: "sendbutton"}) }, /** * 今現在マルチシグ送金を行いたいがよくわからないので一つずつ処理できればと思う * */ async sendMultisig(qrContent: any) { // 公開鍵を調べる const accountHttp = new AccountHttp('http://localhost:3000'); const address = Address.createFromRawAddress('SD5DT3-CH4BLA-BL5HIM-EKP2TA-PUKF4N-Y3L5HR-IR54'); accountHttp .getAccountInfo(address) .subscribe(accountInfo => console.log(accountInfo), err => console.error(err)); // テストとしてアカウントの作成が行われるか試す // const account = Account.generateNewAccount(NetworkType.MIJIN_TEST); // console.log('Your new account address is:', account.address.pretty(), 'and its private key', account.privateKey); // 1個目 // Your new account address is: SC7B5U-GMABRU-QC24YU-ME4JAW-GZBNKF-4AO6WQ-77FW // and its private key // 46E0D6466801F9202A227F67E86B0E4A6CC616833E9E1FD6A16BD98DCB21A87D // 2個目 // Your new account address is: SCLIPO-74NVXP-MNHT6O-EB6PXH-SFMX7S-EN5HB5-VWIZ // and its private key // 3329530DA473FF9F57FEBCF6DFC96996F0726BA2131AD7B184DA5BB0C966160D // 3個目 // Your new account address is: SAGIBM-SJUL2J-IUBQU6-3LVZJY-K75QUI-N6XA3Z-2DIL // and its private key // 32DCAFD970C64BC73433E0E9094B90F2F910E9A7EC493C9ABB79B79DF363E906 // おそらくこの時点ではマルチシグに必要な変数定義のみが行われていると思う // const transactionHttp = new TransactionHttp( 'http://localhost:3000'); // // 送信者の秘密鍵 // const cosignatoryPrivateKey = process.env.COSIGNATORY_1_PRIVATE_KEY as string; // const cosignatoryAccount = Account.createFromPrivateKey(cosignatoryPrivateKey, NetworkType.MIJIN_TEST); // // マルチシグアカウントのパブリックキー // const multisigAccountPublicKey = process.env.MULTISIG_ACCOUNT_PUBLIC_KEY as string; // const multisigAccount = PublicAccount.createFromPublicKey(multisigAccountPublicKey, NetworkType.MIJIN_TEST); // // 受信者のアドレス // const recipientAddress = Address.createFromRawAddress('SD5DT3-CH4BLA-BL5HIM-EKP2TA-PUKF4N-Y3L5HR-IR54'); // // 通常のトランザクションの作成 // const transferTransaction = TransferTransaction.create( // Deadline.create(), // recipientAddress, // [NetworkCurrencyMosaic.createRelative(10)], // PlainMessage.create('sending 10 cat.currency'), // NetworkType.MIJIN_TEST); // アグリゲートトランザクションの作成 // const aggregateTransaction = AggregateTransaction.createComplete( // Deadline.create(), // [transferTransaction.toAggregate(multisigAccount),], // NetworkType.MIJIN_TEST, // []); // 多分これは連署者の署名の実装 // const networkGenerationHash = process.env.NETWORK_GENERATION_HASH as string; // const signedTransaction = cosignatoryAccount.sign(networkGenerationHash); //transactionHttp //.announce(signedTransaction) //.subscribe(x => console.log(x), err => console.error(err)); } }, }; </script> <style> .qrReader { position: absolute; left: 0px; right: 0px; top: 0px; bottom: 0px; margin: auto; width: 300px;/*幅*/ height: 300px;/*高さ*/ text-align: center;/*中央寄せ*/ transition: .3s;/*滑らかな動きに*/ } </style>
QRコードを読み込んだら別のページに戻る処理をしています。
そこでページ遷移はできているのですがそれとは引き換えにエラーがたくさん発生するようになっています
回答2件
あなたの回答
tips
プレビュー