質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

関数

関数(ファンクション・メソッド・サブルーチンとも呼ばれる)は、はプログラムのコードの一部であり、ある特定のタスクを処理するように設計されたものです。

解決済

is not a functionを解決したい

zzziiii
zzziiii

総合スコア5

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

関数

関数(ファンクション・メソッド・サブルーチンとも呼ばれる)は、はプログラムのコードの一部であり、ある特定のタスクを処理するように設計されたものです。

3回答

0評価

1クリップ

1569閲覧

投稿2021/10/24 09:41

TypeError: this.cartNotification.setActiveElement is not a function
を解決したいです。

shopifyのDawnというテーマを元にレイアウトを変えたりしています。
商品ページで、カートに追加というボタンを動かしたいのですが、上記のエラーが出てしまいます。
このエラーはどういうことなのでしょうか?関数でないというのどういうことなのでしょうか?
教えて頂けますと幸いです。

if (!customElements.get('product-form')) { customElements.define('product-form', class ProductForm extends HTMLElement { constructor() { super(); this.form = this.querySelector('form'); this.form.addEventListener('submit', this.onSubmitHandler.bind(this)); this.cartNotification = document.querySelector('cart-notification'); } onSubmitHandler(evt) { evt.preventDefault(); const submitButton = this.querySelector('[type="submit"]'); if (submitButton.classList.contains('loading')) return; this.handleErrorMessage(); /*エラー箇所*/this.cartNotification.setActiveElement(document.activeElement); submitButton.setAttribute('aria-disabled', true); submitButton.classList.add('loading'); const config = fetchConfig('javascript'); config.headers['X-Requested-With'] = 'XMLHttpRequest'; config.body = JSON.stringify({ ...JSON.parse(serializeForm(this.form)), sections: this.cartNotification.getSectionsToRender().map((section) => section.id), sections_url: window.location.pathname }); fetch(`${routes.cart_add_url}`, config) .then((response) => response.json()) .then((response) => { if (response.status) { this.handleErrorMessage(response.description); return; } this.cartNotification.renderContents(response); }) .catch((e) => { console.error(e); }) .finally(() => { submitButton.classList.remove('loading'); submitButton.removeAttribute('aria-disabled'); }); } handleErrorMessage(errorMessage = false) { this.errorMessageWrapper = this.errorMessageWrapper || this.querySelector('.product-form__error-message-wrapper'); this.errorMessage = this.errorMessage || this.errorMessageWrapper.querySelector('.product-form__error-message'); this.errorMessageWrapper.toggleAttribute('hidden', !errorMessage); if (errorMessage) { this.errorMessage.textContent = errorMessage; } } }); }

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

int32_t
int32_t

2021/10/24 12:32

this.cartNotification が何なのか調べましょう。 エラーが出る直前に `console.log(this.cartNotification); console.log(this.cartNotification.constructor.name);` してみるとか。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

関数

関数(ファンクション・メソッド・サブルーチンとも呼ばれる)は、はプログラムのコードの一部であり、ある特定のタスクを処理するように設計されたものです。