Vue.jsのデリミタ(delimiters)を変更する方法

Vue.js

最近はCMSとVue.jsを併用する機会も増えてきたと思います。 そのまま使おうとするとCMS側の変数を展開する記法とVue.js側の記法が被ってしまします。 その場合、Vue.js側の記法を変更することが出来ますので変更してみたいと思います。

では早速公式サイトのマニュアルを見てみたいと思います。

API — Vue.js(delimiters)

公式サイトを見てみると例はこちらとなっていますね。

new Vue({
 delimiters: ['${', '}']
})

CMSと併用することを考えると{}自体を避けた方が良いのかな?
と思いますのでこちらの方が良いかもしれません。

delimiters: ['[[', ']]']

delimiters: ['<%', '%>']

といった形で任意の形式に変更することが可能です。

最近の作業ではa-blog cms、craft CMSで被っており変更した印象があります。 Vue.jsを使う事でCMSの表現出来る幅も広がると思いますので積極的に取り入れて行きたいですね。

前の記事 次の記事

ましじめのスキルが必要ですか?

遠慮なくご相談ください。我々はあなたのプロジェクトに最善を尽くし、
あなたのウェブサイトの制作を強力にサポートすることができます。

ご連絡おまちしています!

ホームページの枠組みを5万円で作成

このホームページと同じ更新できる仕組みを”5万円”で提供しています。

サービスを詳しく見たい方へ