IM UIKit 提供用于展示和编辑用户资料的组件 MyAvatarContainer。

界面效果

界面集成

在您的 React 项目中导入户资料组件，并进行初始化，即可集成该组件。

示例代码如下：

jsx/tsximport React from 'react'
import { Provider, MyAvatarContainer } from '@xkit-yx/im-kit-ui'

const App = () => {
  const initOptions = {
    appkey: '', //传入您的App Key
    account: '', //传入您的accid 
    token: '', //传入您的Token
    debugLevel: 'debug', //设置日志级别
    // ……
  }

  return (
    <Provider initOptions={initOptions} sdkVersion={1}>
      <div className="app">
        <div className="my-user-avatar">
          <MyAvatarContainer />
        </div>
      </div>
    </Provider>
  )
}

集成用户资料的组件后，用户资料界面默认支持如下功能：

• 默认展示用户头像
• 单击头像展开用户资料编辑界面，修改完可直接保存