我們可以使用Flask在Python服務端編寫API,并發送數據給Vue.js等客戶端,下面將介紹如何使用Flask傳遞數據給Vue。
在Flask中,我們需要使用render_template方法將數據嵌入到HTML頁面中并傳遞給Vue。
from flask import Flask, render_template
app = Flask(__name__)
@app.route('/')
def index():
data = {'name': 'Peter', 'age': 22}
return render_template('index.html', data=data)
if __name__ == '__main__':
app.run()
在上面的代碼中,我們建立了一個名為index的路徑,并把data字典傳到index.html頁面中。
接下來,在Vue的客戶端代碼中,我們可以使用axios庫來獲取Flask傳遞的數據。
axios.get('http://localhost:5000/').then(function (response) {
console.log(response.data);
}).catch(function (error) {
console.log(error);
});
在上面的代碼中,我們向Flask的URL發送一個GET請求,URL地址為localhost:5000,請求回調函數傳遞了response參數來獲取Flask發送的數據。
這就是如何使用Flask和Vue.js傳遞數據了。通過這種方法,開發者可以在Flask中自由設置API并使用Vue.js渲染頁面展示數據。