本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

# 使用 HTML 和 JSX 自定义 Connect 客户代理工作区的视图
<a name="customize-views-jsx-sg"></a>

您可以自定义视图资源布局的外观。当你向[显示视图](show-view-block.md)模块传递输入参数时，你可以使用 HTML 或 JSX 来做到这一点。

完成以下步骤，查看如何使用带有方[显示视图](show-view-block.md)块的 HTML 或 JSX 的简单示例。

1. 使用[显示视图](show-view-block.md)数据块创建流。

1. 打开[显示视图](show-view-block.md)数据块的“属性”页面。

1. 在**视图**下，从下拉列表中选择**详细信息**。

1.  在**分区**部分中，选择**设置 JSON**。

1. 复制并粘贴以下 JSON 代码。此代码显示了如何处理 HTML 或 JSX 表达式。

   **HTML 示例**

   ```
   {
   "TemplateString": 
        "<TextContent>Steps:<ol><li>Customer provides incident information</li><li>Customer provides receipts and agrees with 
            amount</li> <li>Customer receives reimbursement</li></ol></TextContent>"
   }
   ```

   **JSX 示例**

   ```
   {
   "TemplateString":
   "Please provide an introduction to the customers. Ask them how their day is going
   Things to say:
   Hello, how are you today? My name is Bob, who am I speaking to?"
   }
   ```