javascript - Vue 2 Prop值未在模板中渲染

Question

我有这段代码，我试图从模板中的 prop 渲染一个值，但得到一个

Uncaught ReferenceError: channel is not defined

<script>
    Vue.component('itemstable', {
        template: `<div>${channel}</div>`, // this is where the  error occurs.
        props: ['channel'],
        data() {
            return {

            }
        }
    })

    new Vue({
        el: '#items_app',
        data: {
            selectedChannel: 'pos',
            channels: JSON.parse(`["pos","kiosk"]`)
        }

    })
</script>

这是标记:

<div id="items_app">
    <itemstable
        :channel="selectedChannel"
    ></itemstable>
</div>

我尝试更改 Prop 的名称，认为“ channel ”可能是保留词，但是同样的事情发生了。

Answer 1

将 javascript 插值 ${} 更改为 vue 表达式 {{}}

 template: `<div>{{channel}}</div>`,