以下是一个基于React的示例代码，用于遍历层级树并创建用户界面：

import React from 'react';

// 递归地遍历层级树并创建用户界面
const renderNode = (node) => {
  // 如果节点是叶子节点，则直接返回节点的文本内容
  if (node.children.length === 0) {
    return node.text;
  }

  // 否则，递归地遍历子节点并创建React元素
  const children = node.children.map((child) => {
    return renderNode(child);
  });

  // 创建父节点的React元素，并将子节点传递给它
  return (
    

      
{node.text}
      
{children}
    
  );
};

// 创建React组件来渲染整个层级树
const TreeComponent = ({ tree }) => {
  const rootNode = tree.root;

  // 调用递归函数来遍历树并创建用户界面
  const renderedTree = renderNode(rootNode);

  return 
{renderedTree}
;
};

export default TreeComponent;

使用上述示例代码，您可以将层级树作为props传递给TreeComponent组件，并使用React渲染整个层级树的用户界面。

注意：上述示例代码假设层级树的节点对象具有以下属性：id（唯一标识节点）、text（节点的文本内容）和children（子节点的数组）。您可能需要根据您的层级树对象的结构进行相应的调整。