python flask和 vue前端交互demo

好的，这里提供一个简单的 Python Flask 和 Vue 前端交互的 demo，具体实现如下。

首先，在 Flask 中设置路由，返回一个 JSON 格式的数据：

from flask import Flask, jsonify, request

app = Flask(__name__)

@app.route('/api/data', methods=['GET'])
def get_data():
    data = {'name': 'John', 'age': 30}
    return jsonify(data)

接下来，在 Vue 中使用 axios 库向 Flask 发送请求，并展示返回的数据：

<template>
  <div>
    <button @click="getData">获取数据</button>
    <div v-if="result">{{ result }}</div>
  </div>
</template>

<script>
import axios from 'axios'

export default {
  name: 'App',
  data() {
    return {
      result: null
    }
  },
  methods: {
    async getData() {
      const response = await axios.get('/api/data')
      this.result = response.data
    }
  }
}
</script>

在这个 demo 中，我们通过点击按钮触发 Vue 中的 `getData` 方法，该方法使用 axios 库向 Flask 中的 `/api/data` 路由发送 GET 请求，获取数据并将其展示在页面中。

当然，如果你需要更复杂的交互，还需要考虑一些问题，比如跨域、请求参数等。但是这个 demo 可以帮助你快速了解 Flask 和 Vue 前端交互的基本流程。