Vue.js 具名插槽组件:动态展示新闻标题和内容
<html>
<head>
</head>
<script src="vue.js">
</script>
<body>
<div id="app">
<my-slot>
<template v-slot:title>{{title}}</template>
<template v-slot:content>{{content}}</template>
</my-slot>
</div>
<script>
Vue.component("my-slot",{
template:`
<div>
<h3><slot name='title'></slot></h3>
<p><slot name='content'></slot></p>
</div>
`,
data:function(){
return{
count:1
}
}
});
var test=new Vue({
el:"#app",
data:{
title:"考试",
content:"大家携带必要物品考试"
},
})
<pre><code> </script>
</code></pre>
</body>
</html>
原文地址: https://www.cveoy.top/t/topic/nPii 著作权归作者所有。请勿转载和采集!