有没有办法在 Vue 3 中将 DOM 元素作为道具传递？

Question

我是 Vue 的超级新手。虽然我通常不这样做，但我认为在 React + JSX（未测试）中可能会发生这样的事情：

render() {
  const el = <p>Blah <a href="https://example.com">bloop</a> bleh</p>
  return (
    <div>
      <CustomReactComponent someProp={el}
    </div>
  )
}

其中 CustomReactComponent 可以渲染出 this.props.someProp 中的元素。

我可以在 Vue 中实现吗？

出于好奇， 我的用例类似于我上面未经测试的 React 示例。我希望一些但不是所有公共小组件的父组件传递一些文本以显示在某处。除了我想在任何地方包含链接，所以我需要 <a> 标签。我想我可以通过将整个 <p> 或 <span> 元素作为道具传递来完成这项工作。

欢迎其他解决方案！

Answer 1

正如 Estus 在他们的评论中所说，这就是 slots feature 的用途。

有没有办法在 Vue 3 中将 DOM 元素作为道具传递？

Is there any way to pass a DOM element as a prop in Vue 3?

javascript

dom

vue.js

vue-props

vuejs3