SOURCE

var jspang = {
    template:'#ted'
}
var app = new Vue({
    el:'#app',
    data:{
        jspangDada:{
            blogUrl:'http://jspang.com',
            netName:'技术胖',
            skill:"web前端"
        }
    },
    components:{
        'jspang':jspang
    }
});

<script src="https://unpkg.com/vue"></script>
<script src="http://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<h1>实例和内置组件</h1>
<hr />
<div id="app">
    <jspang>
        <span slot="blogUrl">{{jspangDada.blogUrl}}</span>
        <span slot="netName">{{jspangDada.netName}}</span>
        <span slot="skill">{{jspangDada.skill}}</span>
    </jspang>
</div>
<template id="ted">
    <div>
        <p>博客地址: <slot name="blogUrl"></slot></p>
        <p>网名: <slot name="netName"></slot></p>
        <p>技术类型: <slot name="skill"></slot></p>
    </div>
</template>

*:not(button){
    color:#fff;
}
a:visited{
    color:lightblue
}