2022-02-10 vue使用jsx渲染

vue组件内容

<script>
export default {
  name: 'Render',
  functional: true,
  props: {
    render: Function
  },
  render(createElement, context) {
    return context.props.render(createElement)
  }
}
</script>

使用方式

<Render :render="render" />

// 属性值
data() {
    return {
      render: () => {
        return <div>我是jsx</div>
      }
    }
  }

示意图