如何在功能组件中呈现嵌套元素？答案

【问题标题】：How to render nested element in functional component?如何在功能组件中呈现嵌套元素？
【发布时间】：2020-06-26 08:44:40
【问题描述】：

我正在研究如何在组件中渲染多个根元素，功能组件是解决方案，对我来说一切正常，但不确定如何渲染嵌套元素。

请检查代码中的comment，其中我描述了对我有用的内容。

export default {
  name: 'MyFnlComp',
  functional: true,
  render(createElement, { props }) {
    const itemIndex = props.item.index;
    const nestedEle = createElement('div', {}, 'nested element goes here');

    const catCard = createElement('div', {}, nestedEle); // this doesn't work :(
    const userCards = createElement('div', {}, 'Hey! this works'); // this works :)

    return [catCard, userCards];
  },

};

【问题讨论】：

标签： javascript vue.js vue-functional-component

【解决方案1】：

createElement 的最后一个参数应该是字符串或数组..

const catCard = createElement('div', {}, [nestedEle]);

【讨论】：