币游国际平台

Vue.jsSDK

最新更新时间:Jan-15-2024

重要点
即此 遗留问题Vue.jsSDK版本 云形视线V1.x)

细节迁移当前版本SDK系统frontend-frameworks+1.x+s-url-genv1.x),见Vue.jsSDK迁移指南.

概述

Cloudinary Vue.jsSDK提供简单而综合图像和视频上传、变换、优化和交付能力,用代码实现无缝整合Vue.js应用

相关题目
本指南与最新发布版本相关云化Vue.js库里

细节前版本所有新特征和修正见变换.

快速示例

取下变换代码和图像

样本变换

相对简单代码在原创上显示所有下下文前面.jpg图像交付前

  • 裁剪150x150缩略图使用表情检测重力自动判定裁剪位置
  • 圆角20像素半径
  • 应用sepia效果
  • 重叠云标识东南角图像(略加偏移)标识缩至50像素宽度,提高亮度和局部透明度(不透明度=60%)
  • 旋转生成图像(包括叠加量)乘以10度
  • 转换并用PNG格式提供图像(原上传图像为JPG)

URL将包含在上述代码自动生成的图像标签中

以类似方式,你可以变换视频.

深入了解变换

Vue.jsSDK特征

安装搭建

Vue.jsSDK开源https://github.com/cloudinary/cloudinary-vue.还有一个工具整合云化https://github.com/cloudinary/vue-cli-plugin-cloudinary.

开工安装 Vue.jsSDK

Cloudinary Vue.jsSDK是云端JaavaScript库上层sdk运行命令

二叉置云配置

要使用云化Vue.js组件,你至少必须配置产品环境云化Name.可额外定义数选配置参数相关时可在仪表板中查找产品环境配置证书云台.

注解
  • 客户端大多数功能实施不需要认证,所以只需要您的认证云名华府市需要待配置而非API密钥或密钥API秘密从不公开客户端,所以,如果你想使用签名上传生成交付签名服务器端代码使用后端SDKs.
  • 因后向兼容性原因,默认可选值安全性配置参数虚伪.现代应用推荐配置安全性参数切换真实性保证变换URL总生成HTTPS

5云化Vue.js组件可用

  • 链通文允许定义所有子组件应用的共享参数
  • 克隆图像定义云图像标签
  • CIDVideo定义云视频标签
  • 克隆波斯特允许您指定图像显示资源cldVideo父构件使用招贴画属性生成视频播放标签上
  • CldTransformation允许您定义父级构件额外变换(CldImage、CldVideo或CldPoster)。

可全局应用这些选项,直接应用到每个组件,或使用子组件应用到所有子组件链通文组件.

例举 :

  • 全局应用级可使用下列选项之一:
  • 直接分量中
  • 配置带焊接文本应用到所有子组件 :

使用核心avaScript特征

上头JavaScript云芯库库云性Vue.jsSDK基础库JavaScript核心功能在导入后可访问Vue.js代码云芯库里例举 :

Vue.js资本化和数据类型指南

使用Vue.jsSDK时记住这些指南

  • 参数名称:kebab案例.例举 :公共标识高山市骆驼Case并获得支持)
  • 定义组件 :PascalCase.例举 :克隆图像
  • 使用组件 :PascalCasekebab案例.例举 :克隆图像焊接图像
  • 传递参数数据如下:对象类

Vue.js故事手册工具

快速快速测试云化组件故事集提供丰富的视觉界面 代码游乐场 内联文档

开始实验故事书时,从左手菜单中选择组件输入云名公共标识从产品环境查看资产,或查看云式显示资产演示文集产品环境改变参数并观察结果显示即时反射修改实现期望效果后,你可复制代码方便实现结果

Vue.js_Storybook_Screencap

反馈发送

评分本页 :