Vue: Опора не определена при использовании литералов шаблона для шаблона - PullRequest
0 голосов
/ 01 октября 2019

Я пытаюсь создать компонент Vue со следующим кодом:

Vue.component('side-heater-control',{
        props: ['heater'],
        template: "<div>Current temp: ${ heater.currentValueDegC } °C <br><label :for=\"'p-val-'+heater.id\">P:</label><div class=\"input-group mb-3\"><input type=\"number\" v-model.number=\"heater.p\" :id=\"'p-val-'+heater.id\"></div></div>"
    });

это прекрасно работает, когда я реализую его следующим образом, но как только я использую литерал шаблона для шаблона:

Vue.component('side-heater-control',{
        props: ['heater'],
        template: `<div>
        Current temp: ${ heater.currentValueDegC } °C <br>
        <label :for="'p-val-'+heater.id">P:</label>
        <div class="input-group mb-3">
        <input type="number" v-model.number="heater.p" :id="'p-val-'+heater.id">
        </div>
        </div>`
    });

Я получу ReferenceError: heater is not defined

Я создал минимальный пример здесь: https://jsfiddle.net/km9e2n43/2/

...