将全局JSON从Flask app服务器传递到Vue应用程序可以通过以下步骤实现:
jsonify
函数将JSON数据转换为响应对象。from flask import Flask, jsonify
app = Flask(__name__)
@app.route('/api/data', methods=['GET'])
def get_data():
data = {
'key1': 'value1',
'key2': 'value2',
'key3': 'value3'
}
return jsonify(data)
if __name__ == '__main__':
app.run()
axios
库发送HTTP请求获取Flask app服务器提供的JSON数据。import axios from 'axios';
export default {
data() {
return {
jsonData: {}
};
},
mounted() {
this.fetchData();
},
methods: {
fetchData() {
axios.get('/api/data')
.then(response => {
this.jsonData = response.data;
})
.catch(error => {
console.error(error);
});
}
}
}
jsonData
变量来访问从Flask app服务器获取的JSON数据。<template>
<div>
<p>{{ jsonData.key1 }}</p>
<p>{{ jsonData.key2 }}</p>
<p>{{ jsonData.key3 }}</p>
</div>
</template>
这样,Flask app服务器上的全局JSON数据就可以通过API接口传递给Vue应用程序,并在Vue应用程序中使用。
领取专属 10元无门槛券
手把手带您无忧上云