MTAppjQuery v3.0.x から v3.1.0 へのアップグレード

最終更新日:2024.09.23 公開日:2024.09.23

mtapp.multiField は v3.1.0 で Vue.js から Svelte での実装に変更されました。そのため MTAppjQuery v3.0.x から v3.1.0 にアップグレードする際の注意点をまとめました。

当ドキュメントは MTAppjQuery v3.0.x から v3.1.0 以降へのアップグレードの際の注意点です。

MTAppjQuery v2 から v3.1.0 以降へのアップグレードの場合は「MTAppjQuery v2 から v3 へのアップグレード」をご確認ください。

Vue.js の同梱終了と Svelte への移行

MTAppjQuery v3.0.x までの mtapp.multiField v1mtapp.multiField v2 は Vue 2 をベースに構築されています。
2023年12月31日に Vue 2 のサポートが終了(EOL)したことを受け、MTAppjQuery v3.1.0 では Vue.js を Svelte に置き換え、Vue.js 本体の同梱を終了しました。

この変更に伴い、下記の1、2の条件の両方に当てはまる場合は 「v3.1.0用の対応」が必要となり、1の条件だけに当てはまる場合は 「mtapp.multiField v2 から v3 への対応確認」が必要となります。

  1. mtapp.multiField v2 を利用している
  2. オリジナルフィールド(独自の Vue コンポーネント)を利用している

multiFieldのバージョン確認方法と対応の要否

ご利用中の mtapp.multiField()mtapp.multiField v1mtapp.multiField v2mtapp.multiField v3 のいずれに該当するかは、mtapp.multiField()version オプションの値で判定できます。

version オプションの設定 mtapp.multiField のバージョン オリジナルフィールドの利用 v3.1.0用の対応 mtapp.multiField v2 から v3 への対応確認
version: 1 mtapp.multiField v1 非対応 不要

不要

version: 2 mtapp.multiField v2 利用あり 必要 不要
version: 2 mtapp.multiField v2 利用なし 不要 必要
version: 3 mtapp.multiField v3 非対応 不要 不要
(version 指定なし) mtapp.multiField v3 非対応 不要 不要
// mtapp.multiField v1 を利用しているフィールド → 対応不要
mtapp.multiField({
    version: 1,
    ...以下省略
});

// mtapp.multiField v2 を利用しているフィールド
// → オリジナルフィールドを利用している場合 → v3.1.0用の対応が必要
// → オリジナルフィールドを利用していない場合 → mtapp.multiField v2 から v3 への対応確認が必要
mtapp.multiField({
    version: 2,
    ...以下省略
});

// mtapp.multiField v3 を利用しているフィールド → 対応不要
mtapp.multiField({
    version: 3,
    ...以下省略
});

// mtapp.multiField v3 を利用しているフィールド → 対応不要
mtapp.multiField({
    ...以下省略(version オプションの指定なし)
});

v3.1.0用の対応

mtapp.multiField v2 でオリジナルフィールド(独自の Vue コンポーネント)を利用していて、引き続きオリジナルフィールドを利用する場合、Vue 2 ベースの mtapp.multiField v2 を利用する必要があります。

そのためには、下記の2つの設定が必要となります。

1. プラグインの設定変更

システムまたは各サイトのMTAppjQueryプラグインの設定の「利用データの設定」セクションの中の「Vue 2 版の mtapp.multiField」のドロップダウンリストから「有効」を選びます。

すると、Vue.js の URL を入力する欄が表示されるので、そこにURLを入力して保存してください。URL の初期値は Vue 2 の CDN のURL になっています。

2. user.js の mtapp.multiField() に useVueJs:true を追加

プラグインの設定を変更した後、該当するフィールドの mtapp.multiField() のオプションに useVueJs: true を追加してください。

// Vue 2 版の mtapp.multiField v2 を利用する
mtapp.multiField({
    version: 2,
    useVueJs: true, // プラグイン設定を変更後、この行を追加します
    ...以下省略
});

mtapp.multiField v2 から v3 への対応確認

mtapp.multiField v2 の利用状況によってはテンプレートの修正などの対応が必要になる場合があります。詳細は以下のドキュメントをご確認ください。

将来的な削除予定

Vue 2 版のマルチフィールド機能は、将来のバージョンで削除される予定です。

mtapp.multiField v2 でオリジナルフィールドをご利用の場合は、mtapp.multiField v3 の「汎用フィールド」への置き換え等を検討していただく必要があります。オリジナルフィールドをご利用になっている場合は support@bit-part.net までご連絡ください。