vue中获取SQL查询的结果，以单选框的形式展示查询到的内容

你可以借助 Vue Resource 库来进行 HTTP 请求和处理响应结果，在获取到查询结果后将其传递给 Vue 组件，通过 v-for 指令和 v-bind 指令绑定数据到单选框中：

<template>
  <div>
    <h2>Select an option:</h2>
    <div v-for="result in results" :key="result.id">
      <input type="radio" v-model="selectedResult" :value="result.id"> {{ result.name }}
    </div>
  </div>
</template>

<script>
  import Vue from 'vue';
  import VueResource from 'vue-resource';

  Vue.use(VueResource);

  export default {
    data() {
      return {
        results: [],
        selectedResult: null,
      };
    },

    methods: {
      fetchResults() {
        this.$http.get('/api/query')
          .then(response => {
            this.results = response.body;
          });
      },
    },

    created() {
      this.fetchResults();
    },
  };
</script>

这里假设 `/api/query` 是后端查询接口的 URL。当组件创建时，会调用 `fetchResults` 方法获取查询结果，并将结果赋值给 Vue 实例的 `results` 属性。然后在模板中，使用 v-for 指令遍历 `results` 数组，将每个结果展示到单选框中，使用 v-model 指令绑定选中的结果的 id 到 Vue 实例的 `selectedResult` 属性。当用户选中任一选项时，`selectedResult` 属性会自动更新，因此您可以在组件中访问所选结果。