vue.js에 그림을 추가하는 방법

vue.js에 이미지를 추가하는 방법은 다음과 같습니다. 먼저 추가할 이미지를 json 파일에 넣은 다음 vue 페이지에서 json 파일을 참조합니다(예: "../../static /에서 imgs 가져오기). json/img.json"].

이 튜토리얼의 운영 환경: Windows 7 시스템, Vue2.9.6 버전, Dell G3 컴퓨터.

vue.js 이미지를 추가하는 방법은 다음과 같습니다.

(동영상 공유 학습: php video tutorial)

방법 1: 이미지 경로를 데이터에 저장

imgList: [
          {
            openItem: '../static/icon/ic_police.png'
          },
          {
            openItem: '../static/icon/ic_prepay_confirm.png'
          },
          {
            openItem: '../static/icon/ic_checkout.png'
          },
          {
            openItem: '../static/icon/ic_lvye.png'
          },
          {
            openItem: '../static/icon/ic_invoice.png'
          },
          {
            openItem: '../static/icon/ic_bill.png'
          }
        ]

방법 2: 해당 경로로 바로 이동 함수 방법 이미지 경로에 액세스

let src = require('../../assets/homeImg/home_icon1.png');

방법 3: 이미지를 json 파일에 넣은 다음 vue 페이지

import imgs from "../../static/json/img.json"
export default {
	data () {
		return {
			imgList: imgs.images
		}
	}
}

에서 json 파일을 참조합니다. 관련 권장 사항: vue.js tutorial

위 내용은 vue.js에 그림을 추가하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!