How to display an image that is upload via file field of a custom page form

title: homeref
'@extends': default

form:
    fields:
        tabs:
            fields:
                content:
                    type: ignore
                options:
                    type: ignore
                advanced:
                    type: ignore
                referenties:
                    type: tab 
                    title: Referenties
                    fields:
                        header.referenties:
                            type: list
                            label: Referenties
                            fields:
                                .image:
                                    type: file
                                    label: referentie IMG
                                    multiple: false
                                    destination: 'theme@:/images'
                                .text:
                                    type: text
                                    label: Referentie beschrijving

{% for img in header.referenties %}
   {{ page.media[img.image].cache.html('Your Title Text', img.text., 'classname')}}
{% endfor %}
---

{% for img in header.referenties %}
   <img src="{{ url('theme://images/) }},{{ img.image }}" alt="{{ img.text }}" />
{% endfor %}

{% for img in header.referenties %}
   {{ dump( img) }}   <!-- logs maybe an array? -->
   {{ dump( img.name) }}   <!-- logs maybe the name ? -->
   {{ dump( img.url) }}   <!--  logs maybe the url -->
   {{ dump( img.text) }}   <!-- should log your 'Referentie beschrijving' ? -->
{% endfor %}

destination: 'self@'

{% for data in header.referenties %} {# Loops over the values of referenties -> referenties is an array #}
    {% for img in data.image %} {# Loops over the values of image -> image is also an array #}
        {{ page.media[img.name].html }} {# Displays the image #}
    {% endfor %}
{% endfor %}