在学习插槽的时候,发现如果只是单纯写匿名插槽,是OK的

    <div id="app">
        <rin>
            插槽的位置,谁敢动
        </rin>
    </div>
    <template id="temp">
        <div>
            this is a children template
            <br> 
            <slot>

            </slot>
        </div>
    </template>
    <script>
        Vue.component("rin",{
            template:"#temp"
        })
        var vm = new Vue({
            el: "#app",

        });
    </script>

此处,“插槽的位置,谁敢动”,是可以显示出来的
但是当使用具名插槽的时候,发现,插槽的内容却是无法展示

后来才发现,插槽的v-slot标签实在2.6版本之后才有的,之前的版本都是slot-scope,
而我引用的是2.2.2版本的vue,自然识别不出。

   <script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script> 

所以只要去vue官网把js文件下下来就行

Logo

前往低代码交流专区

更多推荐