FlaskにVue変数をぶち込む方法

「FlaskにVue変数をぶち込む方法」のアイキャッチ画像

Vueインスタンスのメンバを表示させようとしたらエラーが出てきたので一応シェア

適当なコードですが、年末なので大目にみてください

# html
 <ul id="example1">
    [[ data ]]
</ul>

# javascript
  <script>
        var example1 = new Vue({
            el: '#example1',
            data: {
                message: 'Hello Vue!'
             },
            delimiters: ['[[', ']]']
        });
    </script>

 

上記コードを実行するとこんな感じのhtmlが出ています

 

 

キーポイントは 「delimiters: [‘[[‘, ‘]]’]」を入れてやることみたいなので、もうちょい詳しく知りたい方は以下の参考リンクより自分で調べてください

 

参考にした記事
How to render by Vue instead of Jinja