현지화된 텍스트에서 vue별 지시어를 사용할 수 있습니까?

현지화된 텍스트에서 vue별 지시어를 사용할 수 있습니까?

이제 막 사용하기 시작했어요.vue-i18n를 사용하려고 했습니다.v-on- contractions (contractions 및 :)@)를 사용합니다.

내가 하려던 일:

// locale definition
let locale = {
  en: {
    withEventListener: 'Some HTML with <a @click="onClickHandler">event handling</a>'
  }
}

및 vue 템플릿:

<!-- vue template be like -->
<p v-html="$t('withEventListener')" />

이는 오류를 발생시키지 않지만 vue-js에 의해 평가되지 않습니다.그 결과 Plain-HTML은 다음과 같이 됩니다.

<p>
    Some HTML with <a @click="onClickHandler">event handling</a>
</p>

따라서 Vue가 텍스트를 '평가'하여 텍스트 내의 지시를 '번역'할 수 있는 방법이 있는지 묻고 싶습니다.

독립 실행형 빌드 스크립트를 포함하는 경우 Vue.compile을 사용하여 이와 같은 작업을 수행할 수 있습니다.잘 모르는데vue-i18n하지만 이렇게 하면 올바른 길로 갈 수 있습니다.

주의해 주세요.withEventListener포장하다div템플릿에 관한 규칙 때문입니다.

let locale = {
  en: {
    withEventListener: '<div>Some HTML with <a @click="onClickHandler">event handling</a></div>'
  }
}

const res = Vue.compile(Vue.t("withEventListener"));

Vue.component("internationalized", {
  methods:{
    onClickHandler(){
      alert("clicked")
    }
  },
  render: res.render,
  staticRenderFns: res.staticRenderFns
})


new Vue({
  el:"#app"
})

템플릿 사용

<div id="app">
  <internationalized></internationalized>
</div>

작업 예

언급URL : https://stackoverflow.com/questions/42585557/is-it-possible-to-use-vue-specific-directives-in-localized-text