Директива Vue не работает на рендере

Question

У меня есть функция рендеринга следующим образом

function renderCheckbox(data, type, row, meta) {
  return `<input type='checkbox' value='test' v-model='somedata' />`
}

const test = new Vue({
        el: '#just-test',

        data: {
            somedata: []
        }

В шаблоне у меня есть {{somedata}} для его проверки.

Кажется, директива там не работает.При рендере значение не возвращается.V-модель выглядит как атрибут, а HTML при проверке выглядит следующим образом:

<input type="checkbox" value="test" v-model="somedata">

Однако, если я записываю утверждение непосредственно в шаблон, v-модель работает.Следовательно, {{somedata}} отображается как ["test"] при рендеринге.Любое объяснение и решение по этому поводу?

Answer 1

Ваша функция визуализации должна создавать JavaScript.Например:

Vue.component('anchored-heading', {
  render: function (createElement) {
    return createElement(
      'h' + this.level,   // tag name
      this.$slots.default // array of children
    )
  }
})

Пожалуйста, используйте шаблон для html-подобного синтаксиса.