首页 > 编程语言 >直播网站源码,Vue获取URL图片的宽高

直播网站源码,Vue获取URL图片的宽高

时间:2022-08-17 14:12:20浏览次数:78  
标签:Vue img URL height 源码 图片

直播网站源码,Vue获取URL图片的宽高

方法1:函数类型

 

datadragEnd() {
// 创建实例对象
var img = new Image();
// 图片地址
img.src = "http://celiang.oss-cn-hangzhou.aliyuncs.com/measurement/2022-05/19/G0JSVphpS2MItH1652924237220519.jpg";
let res = {}
img.onload = function () {
 res = {
width: img.width,
height: img.height
}
console.log(res); //获取到图片的宽高
 }

方法2:简便类型

 

// 图片地址
var imgURL = "http://celiang.oss-cn-hangzhou.aliyuncs.com/measurement/2022-05/19/G0JSVphpS2MItH1652924237220519.jpg";
// 创建实例对象
var img = new Image()
// 图片地址
img.src = imgURL 
// 打印
 console.log('width:'+img.width+',height:'+img.height);

 

以上就是直播网站源码,Vue获取URL图片的宽高, 更多内容欢迎关注之后的文章

 

标签:Vue,img,URL,height,源码,图片
From: https://www.cnblogs.com/yunbaomengnan/p/16594975.html

相关文章

  • etcd——源码编译、学习
    借一张图 1、下载https://github.com/etcd-io/etcdgitclone https://github.com/nats-io/nats-server.git 2、编译进入etcd目录, mac/linux下,  makeclea......
  • 使用Jquery的ajaxprefilter来拼接url字符串
    目的:我们每次发请求,如果都需要拼接字符串的话,会特别浪费时间,以及不利于后期维护例如如下代码:$('#form_login').on('submit',function(e){e.preventDefault(......
  • [@vue/compiler-sfc] `defineProps` is a compiler macro and no longer needs to be
    意思是:去掉defineProps导入,可直接使用  vue文档:https://cn.vuejs.org/api/sfc-script-setup.html#defineprops-defineemits......
  • VUE学习-插槽
    插槽匿名插槽子组件设置匿名插槽<scripttype="text/x-template"id="custom-comp"><divclass="custom-comp-container"><h2>{{title}}</h2>......
  • 048_末晨曦Vue技术_处理边界情况之使用$root访问根实例
    处理边界情况之使用$root访问根实例点击打开视频教程在每个newVue实例的子组件中,其根实例可以通过$rootproperty进行访问。例如,在这个根实例中:src\main.jsimpo......
  • vue-router
    路由基本使用//main.jsimport{createRouter,createWebHistory}from'vue-router'importHomeViewfrom'../views/HomeView.vue'importAboutViewfrom'../views/Ab......
  • vue页面实现文本关键字检索,关键字高亮显示及定位功能
    <template><divid="app"><divclass="container"><divclass="header"><inputtype="text"v-model="keyword"><divclass="match-num">{{c......
  • vue学习之------自定义指令(全局)
    main.js中定义:定义指令的函数为:directive()指令名称:第一个参数------fontcolor被绑定的元素:回调函数的第一个参数------el指令被设置的具体值:回调函数的第二个参数----......
  • 从输入URL到页面呈现发生了什么
    一、什么是URL?URL(UniformResourceLocator)叫作统一资源定位符,能够对因特网的资源进行定位。http://119.75.217.109:80/index.html比如上面这个就是百度的URL。UR......
  • Vue+element-ui实现表格数据渲染+分页
    Vue+element-ui实现表格数据渲染+分页具体属性请看官方文档:Table表格这里给大家看一个比较不错的表格数据渲染的例子,也是我目前所写的项目中的一部分。这里呢我们就......