订阅 DID Connect 事件

概览

在本节中，你将学会如何使用 @arcblock/did-connect 订阅登录，退出登录，连接 DID Spaces 成功(等等)的事件。

前置条件

集成 DID Connect 最简单的方式是先创建 Blocklet。如果你还不清楚如何创建 Blocklet，请参考：Create Blocklet 文档
确保您的应用使用了 SessionProvider ，可以参考: https://www.arcblock.io/docs/blocklet-developer/user-and-passport#login

代码示例

订阅登录事件

当用户登录成功之后，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.LOGIN, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

当用户取消登录的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.CANCEL_LOGIN, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

订阅退出登录事件

当用户退出登录的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.LOGOUT, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

订阅切换 Profile 事件

当用户切换 Profile 的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.SWITCH_PROFILE, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

当用户取消切换 Profile 的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.CANCEL_SWITCH_PROFILE, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

订阅切换 Passport 事件

当用户切换 Passport 的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.SWITCH_PASSPORT, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

当用户取消切换 Passport 的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.CANCEL_SWITCH_PASSPORT, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

订阅绑定 DID Wallet 事件

当用户的账户绑定 DID Wallet 的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.BIND_WALLET, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

当用户取消绑定 DID Wallet 的时候，这个事件会被触发。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.CANCEL_BIND_WALLET, (...args) => {

console.log(args);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}

订阅连接 DID Space 事件

当用户连接 DID Space 成功的时候，会触发这个事件。

import { EVENTS } from '@arcblock/did-connect/lib/Session';

function Example() {

const { events } = useSessionContext();

  useEffect(() => {
    events.on(EVENTS.DID_SPACE_CONNECTED, (response, decryptFunc) => {
      console.log(response, decryptFunc);
      // coding...
    });
  }, []);

  return <div>Example</div>;
}