Get list of EU countries in JS file in checkout

[SannNL]

I'm trying to get a list of the EU countries in my checkout (the list that is available in the backend).

I found this PHP code to get the list but i'm not sure on how I would get it into the JS my checkout. I need to show a field depending on if the selected country is in Europe.

Thanks in advance.

I currently have this:

   <item name="vat-country-code" xsi:type="array">
       <item name="component" xsi:type="string">                                   
              BB_Checkout/js/view/vat-country-code
           </item>
   </item>

But of course this leads to a JS file.

[SannNL · Accepted solution]

I found a solution.

I added the following PHP file to my module:

Vendor/Module/Block/EuCountries.php

<?php
namespace BB\Checkout\Block;

use Magento\Directory\Model\ResourceModel\Country\CollectionFactory as CountryCollectionFactory;
use Magento\Framework\App\Config\ScopeConfigInterface;
use Magento\Framework\View\Element\Template;

class EuCountries extends Template
{
    protected $_countryCollectionFactory;
    protected $scopeConfig;

    public function __construct(
        CountryCollectionFactory $countryCollectionFactory,
        Template\Context $context,
        ScopeConfigInterface $scopeConfig,
        array $data = []
    )
    {
        $this->_countryCollectionFactory = $countryCollectionFactory;
        $this->scopeConfig = $scopeConfig;

        parent::__construct($context, $data);
    }


    public function getEuCountries()
    {
        $euCountries = $this
            ->scopeConfig
            ->getValue(
                'general/country/eu_countries'
            );

        return $euCountries;
    }
}

And the corresponding phtml file:

<script>
window.euCountries = "<?php echo $block->getEuCountries(); ?>".split(',');
</script>

And I added a new referenceContainer to checkout_index_index.xml under body.

      <referenceContainer name="content">
            <block class="BB\Checkout\Block\EuCountries" template="BB_Checkout::eu-countries.phtml" name="eu-countries" />
        </referenceContainer>