利用Slot插槽显式的替换掉组件内容
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>插槽</title>
<script src="vue.js"></script>
</head>
<body>
<!-- 使用组件时,显式的替换掉组件中的某块内容,下面示例替换掉弹窗的标题 -->
<div id="app">
<pop-ups>
<span slot="title">替换原有弹窗标题</span>
</pop-ups>
</div>
<script>
Vue.component('pop-ups',{
template:'<div><p><slot name="title">弹窗标题</slot></p><p><slot name="text">默认弹窗内容</slot></p></div>'
})
new Vue({el:'#app'})
</script>
</body>
</html>