不要继承基本的 Directive 类，而是导入并继承 AsyncDirective。

import {directive, AsyncDirective} from 'lit/async-directive.js';

class TimeAgoDirective extends AsyncDirective {

AsyncDirective 基类添加了一些新方法，对需要进行异步渲染的指令很有用：

• setValue() - 可以从异步任务或模板更新周期之外的事件回调中调用，以便异步渲染新值。
• disconnected() - 异步指令通常需要订阅某种异步源（等待 Promise、注册回调、监听 DOM 事件等）。此回调允许指令在 DOM 被移除时取消订阅并执行清理工作。如果没有这个，指令可能会导致内存泄漏。
• reconnected() - 与 disconnected() 类似，已移除的指令也有可能随后重新连接到 DOM。因此，异步指令应该始终实现一个 reconnected 回调，以便在断开连接后恢复运行状态。

我们将在本教程的后续部分使用这些方法。