Input field default value in Vue.js

I have the following PHP+HTML form:

public function doContactForm() {
    ob_start();
    $current_user = wp_get_current_user();
    ?>
<div id="vue_contact_form_app">
    <div class="basic-message" v-bind:class="{ 'error-message' : status == 'error', 'success-message' : status == 'sent' || status == 'sending' }" v-on:click="closeMessage">
            <p v-show="status != 'clean'">{{ actionMessage }}</p>
    </div>
    <form class="vue-form" @submit.prevent="submit">
        <fieldset>
            <div>
                <label class="label" for="name">Your Name:</label>
                <input type="text" name="name" id="name" placeholder="Your Name" required="" maxlength="80" v-model="name">
            </div>
            <div>
                <label class="label" for="email">Your Email:</label>
                <input type="email" name="email" id="email" placeholder="[email protected]" required="" maxlength="40" :class="{ email , error: !email.valid }" v-model="email.value">
            </div>
            <div>
                <label class="label" for="subject">Subject:</label>
                <input type="text" name="subject" id="subject" placeholder="An iteresting idea." required="" maxlength="120" v-model="subject">
            </div>
            <div>
                <label class="label" for="textarea">Message:</label>
                <textarea class="message" name="textarea" id="textarea" placeholder="Dear Mr. Dmitry, ..." required="" v-model="message.text" :maxlength="message.maxlength"></textarea>
                <span class="counter">{{ message.text.length }} / {{ message.maxlength }}</span>
            </div>
            <div class="g-recaptcha" data-sitekey="<?php echo $this->getOption('PublicKey');?>"></div>
            <div>
                <input type="submit" value="Send">
            </div>
        </fieldset>
    </form>
</div>

and the following Vue.js model:

function createVueContactForm(sendUrl) {
new Vue({
    // root node
    el: "#vue_contact_form_app",
    // the instance state
    data: function () {
        return {
            name: "",
            email: {
                value: "",
                valid: true
            },
            subject: "",
            message: {
                text: "",
                maxlength: 64 * 1024
            },
            status: "clean", //error, sending, sent
            actionMessage: "",
        }
    },
    
    computed: {
        hasMessage: function () {
            return this.status != "clean";
        }
    },

How do I set a default value for Your Name input field as $current_user->display_name?

Is there a better (or easier) way than this?

My first idea was that I do this via HTML, but it doesn't work.

See the full source code of my WordPress plugin (it is open-source)