Vue uses static resources in the Asset folder

1. Bind variables for image URL

<template>
  <img :src='imgurl'>
</template>
Copy the code

Set variables in JS

• Import images directly into the module

require imgurl from '.. /assets/test.png'
Copy the code

• Place the imgURL variable in the data

data(){
  return {
    imgurl : require('.. /assets/test.png')}}// Save as an array
data(){
  return {
    test: [{imgurl: require('.. /assets/test.png'),id: '1'}}}]Copy the code

• Set variable values in the lifecycle function

data(){
  return {
    imgurl: ' '}}created(){
  let urltemp = 'assets/test.png';
  this.imgurl = require('@ /' + urltemp);
}
Copy the code