vue2使用background-image设置背景图片不显示

作者: wfaceboss | 来源:发表于2020-06-24 15:17 被阅读0次

第一步：
需要在script中引入图片的路径

import bgImg from '../assets/images/default.png'

第二步：
在data里设置

data(){
 return{
    bgImg: bgImg 
        }
    }

第三步：渲染到页面当中，显示图片的设置

<view  :style="{backgroundImage:`url(${bgImg })`}"></view>

一般情况下，此方式就解决了以上图片显示不出的问题，若是仍然不显示可以试着将图片的大小改小些。（低于300KB）

背景
背景设置：使用background-image来设置背景图片语法：background-image:url(相对...
24.css背景样式,背景图片,重复方式,是否随页面滚动,简写方
设置背景样式设置背景图片使用background-image来设置背景图片语法：background-imag...
背景，雪碧图
使用background-image来设置背景图片语法：background-image:url(相对路径); ...
前端第七天知识总结
背景使用background-image来设置背景图片语法：background-image:url(相对路径)...
背景
设置背景样式：backgrou-color: #bfa；设置背景图片;使用background-image来设置背...
背景
设置背景样式：backgrou-color: #bfa；设置背景图片;使用background-image来设置背...
vue2使用background-image设置背景图片不显示
第一步：需要在script中引入图片的路径第二步：在data里设置第三步：渲染到页面当中，显示图片的设置一般...
微信小程序开发页面总结-文档(ing)
微信小程序开发一定要设置实际宽度使用images一定设置宽- 使用背景图片(background-image)需...
设置背景图片及相关属性
设置背景图片：在CSS可以通过background-image: url();设置背景图片控制背景图片的平铺方...
17、CSS background背景调整
一、背景设置 background-color:设置背景颜色 background-image：设置背景图片- 两...