我有一个组件 ( prism-editor
),它只从v-model="code"
. 这意味着,代码必须通过以下方式发送到组件code
:
代码.vue
<template>
<prism-editor class="my-editor" v-model="code"
:highlight="highlighter" :line-numbers="numbers"/>
</template>
<script>
import { PrismEditor } from 'vue-prism-editor';
export default {
components: {
PrismEditor,
},
data: () => ({
code: this.$slots,
numbers: true
}),
}
</script>
我想Code
从一个插槽命名的父组件绑定它:
页面.vue
<template>
<code language="c">
int main() {
printf('Hello World!');
}
</code>
<template>
<script>
import Code from 'code.vue'
export default {
components: {
'code': Code
}
}
</script>
在我的Code
组件中,我必须找到一种方法来获取插槽数据并将其直接传递code
给要发送到v-model='code'
. 不幸的是,以下不起作用,因为我不知道如何从父级获取数据slot
:
data: () => ({
code: this.$slots // Which obviously doesn't work...
})
换句话说,我只想获取code
标签内发送的所有原始内容:
<code>all this content...</code>`
这可能吗?
.
├── Code.vue
└── Page.vue