订阅 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>;
}