Vue 2属性值未在模板中呈现

Question

I have this code where I am trying to render a value from prop in the template but getting a

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>

and here is the markup:

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

I have tried changing the name of the prop thinking 'channel' might be a reserve word, but the same thing happens.

Answer 1

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

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