First time using a salesforce web-to-lead form in a vue app. Trying to add axios (requirement for the current project) and am getting back a COR issue:
Failed to load https://ap4.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access.
 

import axios from 'axios';

export default ({
  name: 'app',
  data() {
    return {
      country: '',
      first_name: '',
      last_name: '',
      email: '',
      company: '',
      URL: '',
      phone: '',
      revenue: '',
      emailOptOut: ''
    }
  },
  methods: {
    submitForm() {
      axios.post('https://ap4.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8', {
        crossdomain: true,

        country: this.country,
        first_name: this.first_name,
        last_name: this.last_name,
        email: this.email,
        company: this.company,
        URL: this.URL,
        phone: this.phone,
        revenue: this.revenue,
        emailOptOut: this.emailOptOut
      }).then(response => {
        this.response = JSON.stringify(response, null, 2)
      })
    }
  }
})
<template>
<div id="app">
 <div class="main">
      <div class="container"> 
        <img src="/images/image.png" alt="">
          <h1>Test Account<br>Sign Up</h1>  
          <form @submit.prevent="submitForm">

        <input type=hidden name="oid" value="webtoformnumber">
        <input type=hidden name="retURL" value="https://www.project.com/thankyou">

<div class="field">
    <label for="country">
      Country
    </label>
  <div class="control">
      <input class="input" id="country" name="country" type="text" v-model= "country" required autocomplete="off">
  </div>
</div>

<div class="field">
  <label for="first_name">First Name</label>
  <div class="control">
    <input class="input" id="first_name" name="first_name" type="text" v-model= "first_name" required autocomplete="off">
  </div>
</div>

<div class="field">
  <label for="last_name">Last Name</label>
  <div class="control">
    <input class="input" id="last_name" name="last_name" type="text" v-model= "last_name" required autocomplete="off">
  </div>
</div>

Pretty new at this so apologise in advance is theres already an answer out there (checked but can't seem to find one for vue/sfdc/axios)
Any help would be greatly appreciated! Thanks!

First time using a salesforce web-to-lead form in a vue app. Trying to add axios (requirement for the current project) and am getting back a COR issue:
Failed to load https://ap4.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8081' is therefore not allowed access.
 

import axios from 'axios';

export default ({
  name: 'app',
  data() {
    return {
      country: '',
      first_name: '',
      last_name: '',
      email: '',
      company: '',
      URL: '',
      phone: '',
      revenue: '',
      emailOptOut: ''
    }
  },
  methods: {
    submitForm() {
      axios.post('https://ap4.salesforce.com/servlet/servlet.WebToLead?encoding=UTF-8', {
        crossdomain: true,

        country: this.country,
        first_name: this.first_name,
        last_name: this.last_name,
        email: this.email,
        company: this.company,
        URL: this.URL,
        phone: this.phone,
        revenue: this.revenue,
        emailOptOut: this.emailOptOut
      }).then(response => {
        this.response = JSON.stringify(response, null, 2)
      })
    }
  }
})
<template>
<div id="app">
 <div class="main">
      <div class="container"> 
        <img src="/images/image.png" alt="">
          <h1>Test Account<br>Sign Up</h1>  
          <form @submit.prevent="submitForm">

        <input type=hidden name="oid" value="webtoformnumber">
        <input type=hidden name="retURL" value="https://www.project.com/thankyou">

<div class="field">
    <label for="country">
      Country
    </label>
  <div class="control">
      <input class="input" id="country" name="country" type="text" v-model= "country" required autocomplete="off">
  </div>
</div>

<div class="field">
  <label for="first_name">First Name</label>
  <div class="control">
    <input class="input" id="first_name" name="first_name" type="text" v-model= "first_name" required autocomplete="off">
  </div>
</div>

<div class="field">
  <label for="last_name">Last Name</label>
  <div class="control">
    <input class="input" id="last_name" name="last_name" type="text" v-model= "last_name" required autocomplete="off">
  </div>
</div>

Pretty new at this so apologise in advance is theres already an answer out there (checked but can't seem to find one for vue/sfdc/axios)
Any help would be greatly appreciated! Thanks!