Vue.js框架--绑定图片几种方式

方式一: 

 <!--注意:写src/assets/文件-->
 <img src="src/assets/logo.png" />

 

方式二:

<img v-bind:src='imgUrl' />


data() {
			return {
				msg: '欢迎使用Vue.js',
				imgUrl: require('./assets/logo.png') //存放图片路径

			}
	 }

方式三:

<img v-bind:src='imgUrl' />
data() {
			return {
				msg: '欢迎使用Vue.js',
 			    imgUrl:'' //图片
 
			}
		},

created(){ //初始化图片数据
		let urlTemp="assets/logo.png";
		this.imgUrl=require("/"+urlTemp);
	}

效果:

Vue.js框架--绑定图片几种方式

 

相关文章:

  • 2022-12-23
  • 2022-01-04
  • 2022-02-09
  • 2021-11-27
  • 2021-12-31
  • 2021-10-20
猜你喜欢
  • 2022-12-23
  • 2021-05-01
  • 2021-12-14
  • 2021-06-09
  • 2022-12-23
  • 2021-11-29
相关资源
相似解决方案