Как предотвратить компиляцию внутреннего HTML внутри некоторых тегов? - PullRequest
Новая
       4

Как предотвратить компиляцию внутреннего HTML внутри некоторых тегов?

0 голосов
/ 15 июня 2019

У меня есть пользовательский компонент, имеющий внутренний html с {{braces}}, вызывающий такие функции, как v-on:click="click()" и другие.Я хочу прочитать этот HTML, а затем работать с ним.

Vue.config.ignoredElements = ['clmn'];
Vue.component("tbln", {
  template: `<div></div>`,
  functional: true,
  render: (h, ctx) => {
    var children = ctx.children.filter(vnode => vnode.tag);
    console.log(children)
    if (ctx.props.show) {
      return children[0]
    } else {
      return children[0].children
    }
  }
})

new Vue({
  el: "#app",
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.10/vue.min.js"></script>
<div id="app">
  <tbln>
    <clmn bind="data" sort="data" align="left"></clmn>
    <clmn no-sort>
        <div>{{ text }}</div>
    </clmn>
    <clmn bind="vvv" sort-func="func"></clmn>

  </tbln>
</div>

Но Vue автоматически компилирует полный текст и выдает ошибки.

Как предотвратить компиляцию внутреннего html в некоторых тегах?

Я пытался решить эту проблему разными способами, но все мне не помогло:

  • Я добавил тег в Vue.config.ignoredElements.Не работает, я улавливаю ошибку

  • v-pre и template не решение, мне просто нужно сделать код
    простым для понимания

...