首页 > 其他分享 >【Vue】vue 动态设置 src 地址

【Vue】vue 动态设置 src 地址

时间:2022-10-17 10:15:00浏览次数:45  
标签:src Vue string 地址 vue 动态

    <img
        class="logo-srkg"
        :src="getImgUrl('hwtm.png')"
        alt=""
      />
const getImgUrl = (src: string): string => {
  return new URL(`../assets/res-kg/${src}`, import.meta.url).href;
};

标签:src,Vue,string,地址,vue,动态
From: https://www.cnblogs.com/cqkjxxxx/p/16798138.html

相关文章

  • [Vue]子组件与父组件之间传值
    1.父组件与子组件传值props1.1定义父组件,父组件传递 inputText这个数值给子组件://父组件//引入的add-widget组件//使用v-bind的缩写语法通常更简单:<add-widget:m......
  • Vue.$nextTick的原理是什么-vue面试进阶
    原理性的东西就会文字较多,请耐下心来,细细品味Vue中DOM更新机制当你气势汹汹地使用Vue大展宏图的时候,突然发现,咦,我明明对这个数据进行更改了,但是当我获取它的时候怎么是上......
  • vue表格大量input框渲染性能优化
    背景有一个表格,想要通过输入框编辑内容,但是在性能低下的电脑渲染1000+的输入框时该页面存在加载缓慢的问题原因不同的dom渲染消耗的内存是不一样的,input输入框消耗比较......
  • vue-element图片上传
    <el-upload action="" :limit="1" :on-change="handleChange" :auto-upload="false" :file-list="fileList" :show-file-list="false"> <span>选择文件</span></e......
  • [转] VUE 的常用指令
    <divid="app"><pv-text="username"></p><pv-text="gender">性别</p><p>姓名:{{username}}</p><p>性别:{{gender}}</p>......
  • Vue CLI的详细介绍与讲解
    目录什么是VueCLICLI是什么意思?VueCLI使用前提安装Node.JScnpm安装VueCLI使用前提-WebpackVueCLI的使用VueCLI2选项详解目录结构详细Runtime-Compiler和Runtime-on......
  • Vue.js -- 样式绑定
    前言本文主要介绍了vue.js样式绑定的几种形式。class字符串形式代码演示:<!DOCTYPEhtml><htmllang="en"><head><title>vue样式绑定</title><scriptsrc=......
  • Vue组件和插件
    两者的区别组件注册通过“Vue.component”或“components”属性,而插件通过“Vue.use()”;组件是用来构成App的业务模块,它的目标是“App.vue”,而插件是用来增强技术栈的功......
  • 第一章 Vue基础入门
    文章目录​​引言​​​​1.快速入门​​​​1.1.创建项目​​​​1.2.模型和视图​​​​1.3.双向数据绑定​​​​2.{{}}-插值​​​​2.1.语法​​​​2.2.案例​​​......
  • Vue事件不带参数和带一个参数
    <script>exportdefault{ data(){  return{   message:0,   put1:'www.96net.com.cn',  } }, methods:{  dianji(p){   ......