vue 向后台get请求时如何分别传递两个参数

您可以在 URL 中使用查询字符串传递两个参数，例如：/api?param1=value1&param2=value2。您也可以使用 Axios 库来发送 GET 请求并传递参数，示例代码如下：

axios.get('/api', {
  params: {
    param1: 'value1',
    param2: 'value2'
  }
})
.then(response => {
  console.log(response.data)
})
.catch(error => {
  console.log(error)
})

相关问题

vue elmentui 请求后台获取数据进行饼图绘制

非常感谢您的问题。对于您的问题，我可以回答。

要使用Vue Element UI在前端请求后台获取数据并绘制饼图，您可以先通过Vue Resource或Axios等工具发送GET或POST请求，将返回的数据作为参数传递给Element UI的饼图组件，然后使用组件的数据属性和配置属性设置饼图的外观和行为。

下面是一个简单的示例代码：

<template>
  <div>
    <el-chart :data="chartData" type="pie" :settings="chartSettings"></el-chart>
  </div>
</template>

<script>
import { reactive } from 'vue';
import { ElChart } from 'element-plus';

export default {
  components: {
    ElChart,
  },
  setup() {
    const chartData = reactive({
      legend: ['A', 'B', 'C', 'D', 'E'],
      series: [
        { name: 'A', value: 235 },
        { name: 'B', value: 274 },
        { name: 'C', value: 310 },
        { name: 'D', value: 335 },
        { name: 'E', value: 400 },
      ],
    });

    const chartSettings = reactive({
      title: 'Pie Chart',
      tooltip: { trigger: 'item' },
      legend: { type: 'scroll', orient: 'vertical', right: 10, top: 20, bottom: 20 },
      series: [
        {
          type: 'pie',
          radius: '55%',
          center: ['40%', '50%'],
          data: chartData.series,
          emphasis: { scale: true, focus: 'series' },
          label: {
            show: true,
            formatter: '{b}: {d}%',
          },
          labelLine: { show: true },
        },
      ],
    });

    return { chartData, chartSettings };
  },
};
</script>

这个例子使用Vue 3和Element Plus库，并在setup函数中使用reactive函数定义了两个响应式对象，用于保存饼图的数据和配置。饼图组件的类型设置为'pie'，数据设置为chartData.series，配置设置为chartSettings。您可以将这些数据和配置替换为从后端接收到的数据和您自己的饼图配置。

希望这个示例代码可以帮助您。

后台接口既有RequestBody，也有RequestParam的请求，前端vue用axiso怎么写

在Vue中，你可以使用axios来发送既有RequestBody，又有RequestParam的请求。下面是一个示例代码：

import axios from 'axios';

const formData = new FormData();
formData.append('param1', 'value1');
formData.append('param2', 'value2');

axios.post('http://example.com/api/endpoint', formData, {
  headers: {
    'Content-Type': 'multipart/form-data'
  },
  params: {
    param3: 'value3',
    param4: 'value4'
  }
})
.then(response => {
  console.log(response.data);
})
.catch(error => {
  console.log(error);
});

在上面的示例中，我们使用了axios发送一个POST请求，请求的参数包括一个RequestBody和两个RequestParam。我们将RequestParam放在params对象中，RequestBody放在FormData对象中，最后将FormData对象封装到axios的post方法中，并设置Content-Type为multipart/form-data。

如果后台接口需要接收的是JSON格式的RequestBody，那么可以使用axios的post方法的第二个参数直接传递一个JSON对象，如下所示：

import axios from 'axios';

const requestBody = {
  param1: 'value1',
  param2: 'value2'
};

axios.post('http://example.com/api/endpoint', requestBody, {
  headers: {
    'Content-Type': 'application/json'
  },
  params: {
    param3: 'value3',
    param4: 'value4'
  }
})
.then(response => {
  console.log(response.data);
})
.catch(error => {
  console.log(error);
});

在上面的示例中，我们将RequestBody直接传递一个JSON对象，设置Content-Type为application/json。