<view style="background-image: url('{{imgurl}}');width:{{size}}rpx;height:{{size}}rpx;border:1rpx solid red"></view>
var base64 = this.svgToEncodeURL(basestr)
this.setData({
imgurl:base64
})
在onload里给imgurl赋值无效 图片还是空白
.test{
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid' class='lds-ellipsis'%3E %3Ccircle cx='84' cy='50' r='0' fill='%23ccccccc'%3E %3Canimate attributeName='r' values='10;0;0;0;0' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='0s'%3E%3C/animate%3E %3Canimate attributeName='cx' values='84;84;84;84;84' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='0s'%3E%3C/animate%3E %3C/circle%3E %3Ccircle cx='43.1099' cy='50' r='10' fill='%23E8574E'%3E %3Canimate attributeName='r' values='0;10;10;10;0' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='-0.85s'%3E%3C/animate%3E %3Canimate attributeName='cx' values='16;16;50;84;84' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='-0.85s'%3E%3C/animate%3E %3C/circle%3E %3Ccircle cx='16' cy='50' r='7.9735' fill='%2343A976'%3E %3Canimate attributeName='r' values='0;10;10;10;0' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='-0.425s'%3E%3C/animate%3E %3Canimate attributeName='cx' values='16;16;50;84;84' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='-0.425s'%3E%3C/animate%3E %3C/circle%3E %3Ccircle cx='84' cy='50' r='2.0265' fill='%23304153'%3E %3Canimate attributeName='r' values='0;10;10;10;0' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='0s'%3E%3C/animate%3E %3Canimate attributeName='cx' values='16;16;50;84;84' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='0s'%3E%3C/animate%3E %3C/circle%3E %3Ccircle cx='77.1099' cy='50' r='10' fill='%23f3b72e'%3E %3Canimate attributeName='r' values='0;0;10;10;10' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='0s'%3E%3C/animate%3E %3Canimate attributeName='cx' values='16;16;16;50;84' keyTimes='0;0.25;0.5;0.75;1' keySplines='0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1;0 0.5 0.5 1' calcMode='spline' dur='1.7s' repeatCount='indefinite' begin='0s'%3E%3C/animate%3E %3C/circle%3E %3C/svg%3E")
}
但是在css里面直接写可以正常用，不知道这是什么原因(我setData赋值的imgurl与css里面的url是同样的)
红点的地方用引号包起来试试
关于svg，我今天是在wxml显示图片，直接<image src="编码后的svg内容",可以，如果在js里data写svgImg="svg内容"，wxml 里<image src="{{svgImg}}"，就不行，我已经用前面的方法了。
不过遇到另外一个问题，
<view class="a">
<image class="b"/>
</view>
这时样式里，.a{bottom:10rpx;}，.b{bottom:10rpx;}，发现a显示的位置大概在bottom220左右的位置，要要写成 .a{bottom:-225rpx;}，才大概跟b距离底部差不多，很奇怪
b是背景，a是图片，现在a写-225rpx在IDE显示在中间了，但是手机上调试就歪在一边，这主要是怕在其他机型上不正常，因为我只能在一台机子上调整。
请具体描述问题出现的流程，并提供能复现问题的简单代码片段（https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html）。