How to add a letter/characters on click in li?

Question

Vue.js

Couldn't find a solution to this problem. I know zhs on average, but it is unlikely that innerHTML += '!' is used in the view.
How to decide?

Given an array. Print the elements of this array as a ul list. Make it so that when you click on any li, '!' is added to the end of it.

Answer 1

data: () => ({
  items: [
    'hello, world!!',
    'fuck the world',
    'fuck everything',
  ],
}),

<ul>
  <li
    v-for="(n, i) in items"
    v-text="n"
    @click="$set(items, i, `${n}!`)"
  ></li>
</ul>