主页 / 问题 / 901319
Accepted
BrainSwitch
Asked:2020-11-02 18:41:36 +0000 UTC2020-11-02 18:41:36 +0000 UTC

VueJS无法在Flask应用程序的主页上工作[重复]

  • 772

Flask 和 VueJS 中有一个小应用程序，结构如下：

static
|- vue.js
templates
|- index.html
server.py

Server.py 文件内容：

from flask import Flask
from flask import render_template

app = Flask(__name__, static_folder = "static")
app.config['SECRET_KEY'] = 'secret!'

@app.route('/')
def get_main_page():
  return render_template('index.html')

if __name__ == '__main__':
 app.run()

以及 index.html 文件的内容：

<!DOCTYPE html>
<html>
<head>
 <script src="/static/vue.js"></script>
 <title>Title</title>
</head>

<body>
  <div id="app">
   {{ message }}
  </div>

  <script>
   var app = new Vue({
     el: '#app',
     data: {
      message: 'Hello Vue!'
     }
   })
  </script>
</body>
</html>

一般来说，加载网页后什么都不显示，完全是白色的。

javascript

1 个回答

  1. Best Answer

    该模板由 Jinja2 模板引擎渲染，该引擎使用双花括号进行变量替换。由于 context 中没有变量，message因此插入了一个空白空间。所以当轮到 Vue 工作时，它不知道在哪里插入字符串 'Hello Vue!'

    • 2

相关问题