Skip to content

Commit 99cd911

Browse files
committed
feat: markdown slots (close: #594)
Source: ```md - Evan You <template slot="projects"> - Vue.js - VueX </template> ``` Usage: ``` <Content/> // get default slot <Content slot="projects"> // get named slot ```
1 parent f8b8c51 commit 99cd911

File tree

4 files changed

+19
-3
lines changed

4 files changed

+19
-3
lines changed

packages/@vuepress/core/lib/app/app.js

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import('@temp/style.styl')
1313

1414
// built-in components
1515
import Content from './components/Content'
16+
import ContentSlotsDistributor from './components/ContentSlotsDistributor'
1617
import OutboundLink from './components/OutboundLink.vue'
1718
import ClientOnly from './components/ClientOnly'
1819

@@ -35,6 +36,7 @@ Vue.use(Router)
3536
Vue.mixin(dataMixin(I18n, siteData))
3637
// component for rendering markdown content and setting title etc.
3738
Vue.component('Content', Content)
39+
Vue.component('ContentSlotsDistributor', ContentSlotsDistributor)
3840
Vue.component('OutboundLink', OutboundLink)
3941
// component for client-only content
4042
Vue.component('ClientOnly', ClientOnly)

packages/@vuepress/core/lib/app/components/Content.js

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,15 +9,19 @@ export default {
99
type: Boolean,
1010
default: true
1111
},
12-
pageKey: String
12+
pageKey: String,
13+
slot: String
1314
},
1415

1516
render (h, { parent, props, data }) {
1617
const pageKey = props.pageKey || parent.$page.key
1718
Vue.component(pageKey, components[pageKey])
1819
return h(pageKey, {
1920
class: [props.custom ? 'custom' : '', data.class, data.staticClass],
20-
style: data.style
21+
style: data.style,
22+
props: {
23+
target: props.slot || 'default'
24+
}
2125
})
2226
}
2327
}
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default {
2+
functional: true,
3+
4+
render (h, { props, slots }) {
5+
return h('div', {
6+
class: 'content'
7+
}, slots()[props.target])
8+
}
9+
}

packages/@vuepress/core/lib/webpack/markdownLoader.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -83,8 +83,9 @@ module.exports = function (src) {
8383

8484
const res = (
8585
`<template>\n` +
86-
`<div class="content">${html}</div>\n` +
86+
`<ContentSlotsDistributor :target="target">${html}</ContentSlotsDistributor>\n` +
8787
`</template>\n` +
88+
`<script>export default { props: ['target'] }</script>` +
8889
(hoistedTags || []).join('\n')
8990
)
9091
cache.set(key, res)

0 commit comments

Comments
 (0)