How does vue reference a picture in assets through src

This article mainly introduces how vue quotes the pictures in assets through src. The introduction in this article is very detailed and has certain reference value. Interested friends must read it!

Vue:src refers to assets's picture to import the picture and declares import backImg from ".. /.. / assets/images/backimg.jpg" in data; export default {data () {return {backImg: backImg,};} use the

Vue introduces pictures. For static img, it can be introduced normally.

/ / you can use @ when binding src using a template / / you cannot use @ and cannot parse; the assets directory cannot be found

Method 1:

/ / put the picture in the static directory

Method 2:

In data, require () comes in:

/ / html

/ / dataimg: require ('@ / assets/img/login/user.png')

Method 3:import comes in

/ / html

/ / scriptimport img from'@ / assets/img/login/user.png'// dataimg: img above is all the content of the article "how vue quotes pictures in assets through src". Thank you for reading! Hope to share the content to help you, more related knowledge, welcome to follow the industry information channel!