阿里云oss上传

  1. <!-- 导入需要的包 -->
  2. <script src="https://avuex.avue.top/cdn/aliyun-oss-sdk.min.js"></script>
  3. <!-- 并且需要入口处全局配置阿里云的参数 -->
  4. Vue.use(AVUE, {
  5. ali: {
  6. region: 'oss-cn-beijing',
  7. endpoint: 'oss-cn-beijing.aliyuncs.com',
  8. accessKeyId: '',
  9. accessKeySecret: '',
  10. bucket: 'avue',
  11. }
  12. })

TIP

1.0.6+

阿里oss上传 - 图1

  1. <avue-form :option="option" v-model="form"> </avue-form>
  2. <script>
  3. export default {
  4. data(){
  5. return {
  6. form:{},
  7. option: {
  8. labelWidth: 120,
  9. column: [
  10. {
  11. label: '阿里上传',
  12. prop: 'imgUrl',
  13. type: 'upload',
  14. listType: 'picture-img',
  15. canvasOption: {
  16. text: 'avue',
  17. ratio: 0.1
  18. },
  19. oss: 'ali',
  20. loadText: '附件上传中,请稍等',
  21. span: 24,
  22. tip: '只能上传jpg/png文件,且不超过500kb',
  23. }
  24. ]
  25. }
  26. }
  27. }
  28. }
  29. </script>