Skip to content

页面实例获取

SDK 提供 getPage 函数获取页面实例, 目前提供了数字人克隆、音色克隆页面和作品列表页面实例。

ts
enum PageName {
    VoiceClone = 'VoiceClone', // 音色克隆页面
    AvatarClone = 'AvatarClone', // 数字人克隆页面
    Creations = 'Creations', // 作品列表页面
}

const page = PomegranateEditorSDK.getPage(pageName);

基本用法

数字人克隆页面

ts
let avatarPage = PomegranateEditorSDK.getPage("AvatarClone");
const page = avatarPage.init(document.getElementById('dom-id'), {
  accessKey: 'your-accessKey',
  eid: 'your-eid', 
  beforeCreateAvatar: () => {
    // 可以在这里查询余额或做些其他操作,resolve 继续进行  reject 停止进行
    console.log('克隆音色前钩子');
    return new Promise((resolve, reject) => {
      // todo something
    })
  },
  afterCreateAvatar: () => {
     // 可以在这里进行扣费及其他相关操作
    console.log('克隆数字人后钩子');
    return new Promise((resolve, reject) => {
      // todo something
    })
  },
  backFunc: () => {
    // 页面左上角返回按钮点击事件
    router.go(-1);
  }
});
// 离开后置销毁页面实例
avatarPage.destroy();

音色克隆页面

ts
let voicePage = PomegranateEditorSDK.getPage("VoiceClone");
const page = voicePage.init(document.getElementById('dom-id'), {
  accessKey: 'your-accessKey',
  eid: 'your-eid', 
  beforeCreateVoice: () => {
    // 可以在这里查询余额或做些其他操作,resolve 继续进行  reject 停止进行
    console.log('克隆音色前钩子');
     return new Promise((resolve, reject) => {
      // todo something
     })
  },
  afterCreateVoice: () => {
    // 可以在这里进行扣费及其他相关操作
    console.log('克隆音色后钩子');
    return new Promise((resolve, reject) => {
      // todo something
    })
  },
  backFunc: () => {
    // 页面左上角返回按钮点击事件
    router.go(-1);
  }
});
// 离开后置销毁页面实例
voicePage.destroy();

作品列表页面

ts
let creationsPage = PomegranateEditorSDK.getPage("Creations");
const page = creationsPage.init(document.getElementById('dom-id'), {
  accessKey: 'your-accessKey',
  eid: 'your-eid', 
  // 点击草稿/草稿编辑处理
  handleDraftFunc: (data: {
    vid: number // 当前视频id  用来获取作品信息
  }) => {
    console.log(data);
    // router.push(xxx?vid=data.vid&nvid=data.nvid)
    new PomegranateEditorSDK(container, {
        // other params ----
        vid: data.vid,
        // other params ----
    })
  },
  // 点击重做/编辑处理
  remakeFunc: (data:{
    vid: number, // 当前视频id  用来获取作品信息
    nvid: number // 新建视频id  用来保存草稿信息
  }) =>{
    console.log(data);
    // 跳转到编辑器承载页面将vid和 nvid 传入
    // router.push(xxx?vid=data.vid&nvid=data.nvid)
    new PomegranateEditorSDK(container, {
        // other params ----
        vid: data.vid,
        nvid: data.nvid,
        // other params ----
    })
  }
});
// 离开后置销毁页面实例
creationsPage.destroy();