Vue.jsとflaskを使うとマスタッシュが衝突する問題&解決法
先日flaskとVue.jsを使って開発をしていたらflaskとVue.jsのマスタッシュが衝突してしまい6時間くらいハマってしまったので解決方法を残しておきます flaskを使っていてVue.jsが反応しなければ試してみる価値があると思います。 Vue.jsとflaskのマスタッシュが衝突するVue.jsとflaskはこんな感じで書いていきますが、よく見てみるとVue.jsとflaskの両方でマスタッシュ構文が使われています。 これが衝突してしまい、Vue.jsのマスタッシュ構文が機能しなくなります マスタッシュ構文 → {{ }} Vue.jsのexample <div id="app"> <p>{{ message }}</p> </div> <script> var app = new Vue({ el: "#app", data:{ message: "Vue.js" } })
【Python】Flask + Vue.js マスタッシュ構文を使い分ける
マスタッシュ構文とはまずは、マスタッシュ構文とはどのようなものなのか解説します。 マスタッシュ構文は変数を波括弧2つ {{}} で囲みます。 Flaskの環境において、Pythonで書いたソースコードから値を渡して表示することができます。 Vue.jsも、同様に値を渡して表示を行うことができます。 それぞれサンプルを見てみましょう。 Flaskでマスタッシュを使ったサンプル from flask import Flask,render_template app = Flask(__name__) @app.route("/") def index(): return render_template("index.html", flask_message = 'Flaskのメッセージ') if __name__ == '__main__': app.debug = True app.run(
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
