Tengo un archivo JSON y estoy usando su contenido para representar dinámicamente el texto dentro de un cuadro. El contenido del cuadro cambia cuando la página se monta por primera vez y al pasar el mouse sobre algunos botones, etc. en la página.

El problema es que el texto en JSON también puede ser dinámico. Por ejemplo:

 . . . "tips": { "home": { "general": "Welcome to ${testPage}"!, "button1": "Click this button to log in." } } . . .

La plantilla de Vue es así (también puede haber código HTML en el texto JSON, así que uso v-html):

 <div v-html="tips.home.general"></div>

También lo intenté así, no funcionó:

 <div>{{tips.home.general}}</div>

Y la variable testPage se define así en el componente por ahora (más tarde, será un valor dinámico que obtendré del backend):

 data: () => ({ testPage: 'test demo page name' })

Todo funciona muy bien, excepto que no puedo hacer que Vue lea esta variable "testPage" como una variable. Simplemente representa el texto "${testPage}".

Resolví este problema antes en JSP simplemente agregando el nombre de la variable en JSON como <%= testPage %>, pero un enfoque similar no funciona aquí.

¿Hay alguna manera de que se pueda hacer en Vue?