<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/vue.js" type="text/javascript">
</script>
</head>
<body>
<div id="app">
<myheader>
<!-- slot 代表插槽的意思,可以写在组件中间 从外部引入插入到组件里的标签-->
<h2 style="color: #FFB6C1;">真帅</h2>
<div slolt="heihei" style="width: 150px;height: 150px;background: brown;"></div>
<!--<img slot="img" src="img/1.jpg"/>-->
<!--有名字的插槽叫做俱名插槽-->
<img slot="img1" src="img/1.jpg" >
</myheader>
</div>
<script type="text/javascript">
var app = new Vue({
el:"#app",
data:{
},
components:{
"myheader":{
template:`
<div>
vue 中slot插槽
最新推荐文章于 2024-05-28 17:25:55 发布