vue的前端，HTML页面没有form和axios如何请求controller

在Vue前端应用中，可以使用axios发送HTTP请求到后端Controller。不需要使用HTML表单来发起请求。以下是一个简单的例子，演示如何使用axios发送POST请求到后端Controller：

1. 首先，需要在Vue应用中安装axios依赖包。可以使用npm命令来安装：

npm install axios --save

2. 在Vue组件中，可以通过import语句引入axios库，并在需要的地方使用axios发送HTTP请求。例如：

<template>
  <div>
    <button @click="sendData">发送数据</button>
  </div>
</template>

<script>
import axios from 'axios';

export default {
  methods: {
    sendData() {
      axios.post('/api/data', {
        name: 'John Doe',
        age: 30
      })
      .then(response => {
        console.log(response.data);
      })
      .catch(error => {
        console.log(error);
      });
    }
  }
}
</script>

在上面的代码中，我们调用了axios.post方法来向后端发送一个POST请求，并传递了一个包含name和age属性的JSON对象作为请求体。当请求成功时，我们打印出响应数据；当请求失败时，我们打印出错误信息。

3. 在后端Controller中，我们可以使用框架提供的路由和控制器功能来处理这个请求。例如，在Laravel框架中，可以这样写一个处理POST请求的路由和控制器方法：

// routes/web.php

Route::post('/api/data', 'DataController@store');

// app/Http/Controllers/DataController.php

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class DataController extends Controller
{
    public function store(Request $request)
    {
        $name = $request->input('name');
        $age = $request->input('age');
        
        // 处理数据并返回响应
    }
}

在上面的代码中，我们定义了一个路由，将POST请求发送到/api/data地址，并将其处理到DataController的store方法中。在store方法中，我们使用$request对象来获取请求体中的name和age属性，并处理这些数据。最后，我们可以使用框架提供的响应方法来返回响应数据。

总之，使用axios可以轻松地在Vue前端应用中发送HTTP请求到后端Controller，并处理响应数据。