Unable to add template text to v-textarea with Vue and Vuetify - vue.js

Question

I have inherited an existing app written in Vue/Vuetify and it has an existing v-textarea element that I am trying to modify. The issue is that we now want to pre-populate this element with sample text that the user can edit to their needs. I have tried adding value and placeholder properties to the v-textarea element and not gotten the sample text to show in the v-textarea.
Here is the dialog that contains the troublesome v-textarea:
<v-dialog v-model="dialogAddComment"
hide-overlay
persistent
max-width="600px">
<v-toolbar card color="blue-grey lighten-4" dense elevation="16">
<v-toolbar-title color='black' class="body-2 ml-3">Add Comment</v-toolbar-title>
<v-spacer></v-spacer>
<v-icon #click.stop="closeDialogAddComment">close</v-icon>
</v-toolbar>
<v-form ref="form" v-model="valid" lazy-validation>
<v-card>
<v-flex>
<v-layout column>
<v-flex xs12 sm6 d-flex mx-3>
<v-select
:items="engagement.allIncidentTypes"
item-text="incidentCategoryText"
item-value="incidentCategoryKey"
label="Category"
:rules="[v => !!v || 'Category is required']"
required
v-model="incident.incidentCategoryKey"
></v-select>
</v-flex>
<v-flex xs12 sm6 d-flex mx-3>
<v-select
:items="zeroTo8"
label="Impact (Hours)"
:rules="[v => (v === 0 || v <9) || 'Impact is required']"
required
v-model="incident.numberOfHours"
></v-select>
</v-flex>
<v-flex xs12 sm6 d-flex mx-3>
<v-textarea
name="input-7-1"
label="Comment"
:rules="[v => !!v || 'Comment is required']"
required
v-model="incident.incidentFreeText"
counter=1024
maxLength=1024
rows=3
value='U Good lockers\nV Damaged lockers\nW Lockers replaced\nX (=U+V+W) Lockers installed\nY Lockers returned to warehouse'
></v-textarea>
<!-- -->
</v-flex>
</v-layout>
</v-flex>
<v-card-actions>
<v-spacer/>
<v-btn :disabled="!valid" color="primary" small #click="addIncident">Submit</v-btn>
<v-spacer/>
</v-card-actions>
</v-card>
</v-form>
</v-dialog>
I have tried setting the placeholder and value properties and seen nothing. I initially tried setting a text property but then found the documentation on the vuetify.js site. They even have a simple example that does exactly what I want to do. But my implementation is not working. and I am stumpped!

Answer 1

You should not set both v-model and value at the same time.
One possible solution is removing v-model and update incident.incidentFreeText in #input event
<v-textarea
name="input-7-1"
label="Comment"
:rules="[v => !!v || 'Comment is required']"
required
counter=1024
maxLength=1024
rows=3
value='U Good lockers\nV Damaged lockers\nW Lockers replaced\nX (=U+V+W) Lockers installed\nY Lockers returned to warehouse'
#input="onInput"
>
</v-textarea>
methods: {
onInput(value) {
this.incident.incidentFreeText = value
}
}
Another possible solution is keeping v-model, remove value, but you need to set
this.incident.incidentFreeText='U Good lockers\nV Damaged lockers\nW Lockers replaced\nX (=U+V+W) Lockers installed\nY Lockers returned to warehouse'
somewhere in your code.