在Vue.js 3中设置自定义分隔符

问题描述

我正在尝试在Vue.js 3中设置自定义分隔符，但它似乎不起作用。

我尝试的第一件事是像这样设置组件参数delimiters：

export default defineComponent({
    delimiters: ["${","}$"],// ...
})

但什么也没发生。

然后我尝试像这样设置 main.ts 文件：

import { createApp } from "vue";
import router from "./router";
import App from "./App.vue";

App.delimiters = ["${","}$"];

createApp(App)
   .use(router)
   .mount("#app");

同样，模板中的字符串插值无效。

我想念什么？

解决方法

需要位于createApp

之内

示例：

var app = Vue.createApp({
  data() {return {message: 'Ciao'}},delimiters: ["${","}$"]
}).mount('#app');

<script src="https://unpkg.com/vue@3.0.1/dist/vue.global.prod.js"></script>
<div id="app"><h1>Message: ${message}$</h1></div>