tinydrive.browse 方法允许用户浏览存储在 Tiny Drive 中的文件。该对话框将允许用户管理 Tiny Drive 中文件，如添加、移动、预览和删除文件。该 API 返回一个 promise，当使用 close 按钮关闭 Tiny Drive 对话框时，该 promise 将被 resolve。

交互式示例：使用 tinydrive.browse

HTML

<textarea id="drive-browse-example">
  此示例展示如何在 tinymce api 中调用 tinydrive。
</textarea>

JS

tinymce.init({
  selector: 'textarea#drive-browse-example',
  height: 200,
  menubar: false,
  plugins: 'tinydrive link image media',
  toolbar: 'custom | insertfile | link image media',
  tinydrive_token_provider: 'URL_TO_YOUR_TOKEN_PROVIDER',
  setup: (editor) => {
    editor.ui.registry.addButton('custom', {
      text: 'Custom browse',
      onAction: () => {
        editor.plugins.tinydrive.browse({
        }).then(() => {
          console.log('Tiny Drive dialog closed.');
        });
      }
    });
  }
});

选项

filetypes

此选项根据以下文件类型类别限制显示的文件：

document

doc、xls、ppt、pps、docx、xlsx、pptx、pdf、rtf、txt、key、pages、numbers

audio

wav、wave、mp3、ogg、oga、ogx、ogm、spx、opus

video

mp4、m4v、ogv、webm、mov

image

gif、jpeg、jpg、jpe、jfi、jif、jfif、pjpeg、pjp、png、tif、tiff、bmp、webp、avif、apng

archive

zip

例如：如果应用程序使用 Tiny Drive 插入图像，则在文件类型数组中设置 ['image']。

类型： Array

交互式示例：使用 filetypes 将 Tiny Drive 限制为图像格式

HTML

<textarea id="drive-pick-images-example">
  此示例展示如何在 tinymce api 中调用 tinydrive。
</textarea>

JS

tinymce.init({
  selector: 'textarea#drive-pick-images-example',
  height: 200,
  menubar: false,
  plugins: 'tinydrive link image media',
  toolbar: 'custom | insertfile | link image media',
  tinydrive_token_provider: 'URL_TO_YOUR_TOKEN_PROVIDER',
  setup: (editor) => {
    editor.ui.registry.addButton('custom', {
      text: 'Custom pick image',
      onAction: () => {
        editor.plugins.tinydrive.pick({
          filetypes: ['image']
        }).then((result) => {
          result.files.forEach((file) => {
            const img = editor.dom.createHTML('img', { src: file.url });
            editor.insertContent(img);
          });
        });
      }
    });
  }
});

max_image_dimension

此选项限制上传图像的宽度和高度。指定后，任何宽度或高度大于指定值的图像将按比例调整大小至指定的最大尺寸。

类型： Number

示例：将 max_image_dimension 与 tinydrive.browse API 一起使用

tinymce.init({
  selector: 'textarea',
  plugins: 'tinydrive image',
  toolbar: 'custombrowse',
  tinydrive_token_provider: 'URL_TO_YOUR_TOKEN_PROVIDER',
  setup: (editor) => {
    editor.ui.registry.addButton('custombrowse', {
      text: 'Custom browse',
      onAction: () => {
        editor.plugins.tinydrive.browse({
          max_image_dimension: 1024
        }).then(() => {
          console.log('Tiny Drive dialog closed.');
        });
      }
    });
  }
});