首先，确保您已将XHP库安装为项目的依赖关系 - 这定义了XHP的各种核心类和标准HTML组件。

XHP是一种用于创建实际Hack对象的语法，称为XHP对象。它们意在用作树，孩子可以是其他XHP对象或文本节点。

创建一个简单的XHP对象

而不是使用new运算符，创建XHP看起来非常像XML：

$my_xhp_object = <p>Hello, world</p>;

$my_xhp_object现在包含一个:p类的实例- 初始:标记为XHP类，但在实例化时不需要。这是一个真正的对象，意思是is_object()返回true，你可以调用它的方法。

下面的例子使用了三个XHP类：:div，:strong，:i。空格是微不足道的，所以你可以在你的代码中创建一个可读的树结构。

<?hh

function basic_usage_examples_basic_xhp(): void {
  var_dump(
    <div>
       My Text
       <strong>My Bold Text</strong>
       <i>My Italic Text</i>
    </div>
  );
}

basic_usage_examples_basic_xhp();

Output

object(xhp_div)#5 (5) {
  ["tagName":protected]=>
  string(3) "div"
  ["attributes":"xhp_x__composable_element":private]=>
  object(HH\Map)#6 (0) {
  }
  ["children":"xhp_x__composable_element":private]=>
  object(HH\Vector)#7 (3) {
    [0]=>
    string(9) " My Text "
    [1]=>
    object(xhp_strong)#12 (5) {
      ["tagName":protected]=>
      string(6) "strong"
      ["attributes":"xhp_x__composable_element":private]=>
      object(HH\Map)#13 (0) {
      }
      ["children":"xhp_x__composable_element":private]=>
      object(HH\Vector)#14 (1) {
        [0]=>
        string(12) "My Bold Text"
      }
      ["context":"xhp_x__composable_element":private]=>
      object(HH\Map)#15 (0) {
      }
      ["source"]=>
      string(91) "/data/users/joelm/user-documentation/guides/hack/24-XHP/02-basic-usage-examples/basic.php:9"
    }
    [2]=>
    object(xhp_i)#19 (5) {
      ["tagName":protected]=>
      string(1) "i"
      ["attributes":"xhp_x__composable_element":private]=>
      object(HH\Map)#20 (0) {
      }
      ["children":"xhp_x__composable_element":private]=>
      object(HH\Vector)#21 (1) {
        [0]=>
        string(14) "My Italic Text"
      }
      ["context":"xhp_x__composable_element":private]=>
      object(HH\Map)#22 (0) {
      }
      ["source"]=>
      string(92) "/data/users/joelm/user-documentation/guides/hack/24-XHP/02-basic-usage-examples/basic.php:10"
    }
  }
  ["context":"xhp_x__composable_element":private]=>
  object(HH\Map)#8 (0) {
  }
  ["source"]=>
  string(92) "/data/users/joelm/user-documentation/guides/hack/24-XHP/02-basic-usage-examples/basic.php:11"
}

在var_dump()该对象的树已创建项目-不是一个HTML / XML字符串。可以通过简单地使用echo/ print()或通过调用生成HTML字符串$xhp_obect->toString()。

动态内容

迄今为止的例子只显示了静态内容，但通常需要包括在运行时生成的东西; 为此，您可以直接在XHP中使用Hough表达式与大括号：

<xhp_class>{$some_expression}</xhp_class>

这也适用于属性：

<xhp_class attribute = {$ some_expression} />

还支持更复杂的表达式，例如：

<?hh

class MyBasicUsageExampleClass {
  public function getInt(): int {
    return 4;
  }
}

function basic_usage_examples_get_string(): string {
  return "Hello";
}

function basic_usage_examples_get_float(): float {
  return 1.2;
}

function basic_usage_examples_embed_hack(): void {
  $xhp_float = <i>{basic_usage_examples_get_float()}</i>;
  $a = new MyBasicUsageExampleClass();

  echo (
    <div>
      {(new MyBasicUsageExampleClass())->getInt()}
      <strong>{basic_usage_examples_get_string()}</strong>
      {$xhp_float /* this embeds the <i /> element as a child of the <div /> */}
    </div>
  );
}

basic_usage_examples_embed_hack();

Output

<div>4<strong>Hello</strong><i>1.2</i></div>

属性

像HTML一样，XHP支持XHP对象上的属性。XHP对象可以具有零到无限数量的可用属性。XHP类定义了该类对象可用的属性。

echo <input type =“button”name =“submit”value =“OK”/>;

这里的:input类有属性type，name并且value作为其属性的一部分。

某些属性是必需的，如果您使用没有该属性的必需属性的XHP对象，则XHP会抛出错误。

HTML字符引用

为了编码一个保留的HTML字符或不容易获得的字符，您可以在XHP中使用HTML字符引用。

<?hh
echo <span>&hearts; &#9829; &#x2665;</span>;

以上使用HTML字符参考编码，使用显式名称，十进制符号和十六进制符号打印出心形符号。