vue + Jquery ajax 从后台取数据代码

在Vue中，通常推荐使用原生的JavaScript进行AJAX请求，因为Vue.js有自己的数据流处理方式。但如果你确实需要使用jQuery进行AJAX请求，可以在Vue的生命周期钩子中进行。

以下是一个使用jQuery的AJAX请求在Vue组件中的例子：

<template>
  <div>
    <div v-if="dataLoaded">
      <!-- 这里渲染你的数据 -->
      {{ data }}
    </div>
    <div v-else>
      <!-- 加载中的状态 -->
      Loading...
    </div>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      data: null,
      dataLoaded: false
    };
  },
  mounted() {
    this.loadData();
  },
  methods: {
    loadData() {
      $.ajax({
        url: '你的后端API地址',
        type: 'GET',
        dataType: 'json',
        success: (response) => {
          this.data = response;
          this.dataLoaded = true;
        },
        error: (xhr, status, error) => {
          console.error('An error occurred:', status, error);
        }
      });
    }
  }
};
</script>

在这个例子中，我们在Vue组件的mounted生命周期钩子中调用了loadData方法，该方法使用jQuery的$.ajax函数从后端API获取数据。成功获取数据后，我们更新组件的本地状态，并在模板中显示数据。

请注意，在现代的前端开发中，建议尽可能避免使用jQuery。如果你的项目中有其他依赖于jQuery的库或代码，除此之外，尽可能使用原生的Fetch API或者axios进行HTTP请求。