Could not find driver (Connection: MySQL, SQL: select * from `invoices`) laravel - vue project

Question

I tried to send the data from the database to the front-end (laravel-vue) I use laragon and PHP 8.1.22.
Steps that I follow to send data:

1. I add this script to ../resources/js/components/Invoice/index.vue

<script setup>
import { onMounted , ref } from 'vue';
let invoices = ref([])
const getInvoices = async () => {
    let response = await axios.get("/api/get_all_invoice")
    console.log('response' , response)
}
onMounted(async() => {
    getInvoices()
})
</script>

1. In the ../routes/api.php

   use App\Http\Controllers\InvoiceController;
   Route::get('/get_all_invoice',[InvoiceController::class,'get_all_invoice']);
   

2. go to the controller and add the function get_all_invoice

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;
use App\Models\Invoice;

class InvoiceController extends Controller
{
    public function get_all_invoice(){
        $invoices = Invoice::all();
        return response()->json([
            'invoice'=>$invoices
        ],200);
    }
}

To solve this problem I tried to enable the extension=pdo_mysql extension=pdo_pgsql in the php.ini for the PHP 8.1.22 in laragon folders and I restart laragon but I have no result.

When I add this code:

<?php phpinfo(); ?> 

To welcome.blade.php and I searched about pdo in the table said no value for pdo drivers is that mean that the pdo is not enabled or is that the default setting?

Answer 1

hy finally it worked I changed the script for getting the data and I restarted Laragon and vs code too

onMounted(() => {
  axios.get('/api/get_all_invoice')
    .then(response => {
      console.log(response.data); 
    })
    .catch(error => {
      console.error('Error fetching users:', error);
    });
});