微信小程序 background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法

这篇具有很好参考价值的文章主要介绍了微信小程序 background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

项目场景

微信小程序,设置background-image直接设置本地图片路径。

问题描述

编辑器正常显示,真机运行不显示

原因分析

background-image只能用网络url或者base64图片编码。

解决方案

1、将本地图片转为网络url后设置到background-image上
例如,云开发,后台上传本地图片

2、本地图片转成base64格式后设置到background-image上

3、弃用background-image赋值的方式,改用 image组件标签src属性文章来源地址https://www.toymoban.com/news/detail-615214.html

到了这里,关于微信小程序 background-image直接设置本地图片路径,编辑器正常显示,真机运行不显示解决方法的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 微信小程序wxss background

    微信小程序里遇到一个关于background的小问题,记录一下啦。 看,这是问题: 解决的方法: 其实人家已经告诉了解决方法 但是我愿意再抄一遍 1.把background属性 写为 采用 image 组件 沉底的方式实现 2.微信小程序view background-image 不能够直接显示本地,但是可以 直接显示网络图

    2024年02月16日
    浏览(55)
  • 微信小程序 background多个background背景图叠加以及连写注意事项

    background: url(\\\'https://xxxxxxxx.com\\\') no-repeat top/100% auto,linear-gradient(318deg, #3F0000 0%, #A9143A 100%); 效果: 坑点: 1:多个背景图叠加时(渐变也相当于图片)以逗号分割,越靠前图片叠加时层级越高。网上搜索时发现找到的都是说越靠后层级越高,但我测试的时候确实是越靠前越高。

    2024年02月15日
    浏览(54)
  • 【微信小程序模板直接套用】微信小程序制作模板套用平台

    微信小程序模板直接套用是小程序制作的好工具,特别是对于没有太多代码基础的企业。下面我分享一个微信小程序模板直接套用平台,超60个行业的微信小程序制作模板套用,页面内容丰富样式多样的微信小程序制作模板套用。 微信小程序模板直接套用平台的存在,就是为

    2024年02月09日
    浏览(52)
  • 微信小程序之Image那些事

    提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 小程序中 Image使用频率是非常高的 不同场景下 Image使用的属性也不一样 因为小程序的image是有默认大小的 所以在使用时不得不手动去设置大小 单一图片都好处理 如果是动态渲染的 该怎么处理呢 大部分

    2024年02月13日
    浏览(46)
  • 微信小程序image标签的使用

    在小程序中,我们可以使用 image 标签来添加图片。 image 标签有以下属性: src :图片路径,可以是本地路径或网络路径 mode :图片裁剪、缩放的模式,默认为\\\"scaleToFill\\\"(缩放以填充整个容器) 添加指向本地图片的 src 属性后的显示效果: image 标签默认会根据图片的宽高自适

    2024年02月03日
    浏览(56)
  • 微信小程序调用直接拨打电话功能

     我们在做小程序的时候,通常回显的电话号码,是要能调用拨打电话的接口,直接拨打电话的,那么如何调用直接拨打电话的接口呢,下面我就简单的记录一下。  1.index.wxml文件 2.index.js文件

    2024年02月12日
    浏览(41)
  • 微信小程序使用image组件显示图片的方法

    本文实例讲述了微信小程序使用image组件显示图片的方法。分享给大家供大家参考,具体如下: 1、效果展示 2、关键代码 ① index.wxml 代码如下: image style=\\\"width: 300px; height: 300px; margin:10px;\\\" mode=\\\"scaleToFill\\\" src=\\\"{{imageSrc}}\\\"/image ② index.js Page({ data:{ // text:\\\"这是一个页面\\\" imageSrc:\\\'../..

    2024年02月12日
    浏览(88)
  • 【微信小程序】image真机无法加载网络图片

    目录 背景 为什么微信小程序  技术思路 前端页面 吐槽 最终解决 今天把车停在了路边,可能是挡住了行人的路,被贴了个条,还留了个纸条——没有你的随车电话,我只能点电话举报你了。气的我牙痒痒! 只能回来自己撸一个挪车电话小工具!这样通过扫描二维码拨打电话

    2024年02月09日
    浏览(86)
  • 最新微信小程序获取头像昵称,直接用,uniapp获取微信小程序头像昵称

    微信小程序获取用户头像和昵称一个开放接口是wx.getUserInfo,2021年4月5日被废弃,原因是很多开发者在打开小程序时就通过组件方式唤起getUserInfo弹窗,如果用户点击拒绝,无法使用小程序,这种做法打断了用户正常使用小程序的流程,同时也不利于小程序获取新用户,后面新

    2024年02月11日
    浏览(49)
  • 微信小程序 怎么插入图片?image组件的使用教程。

    这期我们来学学怎么在小程序中插入图片         是小程序中一个图片的组件         image组件有一个默认宽度和高度(宽300px,高240px)         支持 JPG、PNG、SVG、WEBP、GIF 等格式,2.3.0 起支持云文件ID。 我们先添加一个image组件给他一个边框看看他的默认情况  我们从

    2023年04月09日
    浏览(61)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包