<!--
* @Descripttion: 插槽slot
* @version:
* @Author: zhangfan
* @email: [email protected]
* @Date: 2020-05-14 09:08:01
* @LastEditors: zhangfan
* @LastEditTime: 2020-06-29 09:51:02
-->
<template>
<div class="topCon">
<header-two>
<template v-slot:header="slotProps">
<h1>{{slotProps.user1.lastName}}</h1>
<h1>{{slotProps.user2.lastName}}</h1>
</template>
<template v-slot:contenter>
<p>A paragraph for the main content.</p>
<p>And another one.</p>
</template>
<template v-slot:footer>
<h2>Here's some contact info</h2>
</template>
</header-two>
</div>
</template>
<script>
import headerTwo from "./headerTwo";
export default {
name: "enterpriseDetail",
components: {
headerTwo
},
data() {
return {
};
},
computed: {},
methods: {
}
};
</script>
<style scoped lang="less">
</style><!--
* @Descripttion:
* @version:
* @Author: zhangfan
* @email: [email protected]
* @Date: 2020-06-28 15:24:08
* @LastEditors: zhangfan
* @LastEditTime: 2020-06-29 09:48:01
-->
<template>
<div class="headerTwo">
<slot name="header" v-bind:user1="user1" v-bind:user2="user2">
<h1>{{user1.firstName}}</h1>
<h1>{{user2.firstName}}</h1>
</slot>
<slot name="contenter"></slot>
<slot name="footer"></slot>
</div>
</template>
<script>
export default {
name: "headerTwo",
data() {
return {
user1:{
firstName :"zhang",
lastName :"san"
},
user2:{
firstName :"li",
lastName :"si"
}
};
},
};
</script>
<style scoped lang="less">
</style>