Vue_v-once: 한번 랜더링되면 더이상 바뀌지 않음

<template>

    <div>

        <!-- HTML요소를 단 한번만 랜더링 하도록 설정(Data 속성값이 변경되어도 다시 랜더링 X) -->

        v-once1: <span>{{ username }}</span>                <!-- 이순신 -->

        v-once2: <span v-once>{{ username }}</span><br>     <!-- 홍길동 -->

        {{ changeName() }}                                  <!-- 홍길동을 이순신으로 바꾸는 함수 -->

    </div>

  </template>

 

  <script>

  export default {

    data:function(){

        return {

            username: "홍길동"

        }

    },

    methods: {

        changeName: function(){

            this.username = "이순신"

        }

    }

  }

  </script>

 

  <style>

 

  </style>