小程序
小游戏
企业微信
微信支付
扫描小程序码分享
是通过 image 标签引入 还是有别的方法直接展示
3 个回答
加粗
标红
插入代码
插入链接
插入图片
上传视频
你这接口返回内容不止svg标签呀
可以将svg标签提取出来,转为base64数据,最终替换成<img src="src="data:image/svg+xml;base64,......." />
// strHtml为接口返回的html内容 initContent: function(strHtml) { var t = this, fs = wx.getFileSystemManager(), ps = [] t.svgTags = {} t.contentParts = strHtml.replace(/[\r\n\t]/g, '').split(/(<svg[^>]+>(?:(?!<\/svg>).)*<\/svg>)/g) for (var i in t.contentParts) { if (/<svg/.test(t.contentParts[i])) { t.svgTags[i] = { svg: t.contentParts[i], src: '', file: `${wx.env.USER_DATA_PATH}/svg_${i}` + '.svg' } ps.push((function (k, o, fs) { var file = o.svgTags[k].file return new Promise((rs, rj) => { fs.writeFile({ filePath: file, data: o.svgTags[k].svg, success(res) { o.svgTags[k].src = 'data:image/svg+xml;base64,' + fs.readFileSync(file, 'base64') rs(res) }, fail(res) { console.log(res) rj(res) } }) }) })(i, t, fs)) } } console.log(ps) ps.length && Promise.all(ps).then(res => { console.log(t.svgTags) for(var i in t.svgTags){ t.contentParts[i] = '<img style="width:100%;height:auto;border:0;" src="' + t.svgTags[i].src + '" />' } // 最后处理过的html内容 var ret = t.contentParts.join('') // this.setData({text:ret})可用rich-text显示 <rich-text nodes="{{text}}"></rich-text> console.log(ret) }).catch(e => { console.log(e) }) } ===================================== // 调用 strHtml = '接口返回的html' this.initContent(strHtml) ===================================== //this.setData({text:ret})可用rich-text显示 <rich-text nodes="{{text}}"></rich-text>
若认为该回答有用,给回答者点个[ 有用 ],让答案帮助更多的人
你好,麻烦通过点击下方“反馈信息”按钮,提供出现问题的。
传回来的是什么?截个图看看
请学会如何「提问」(👈戳我)
直接拿到svg的url使用 image组件来显示就可以了
关注后,可在微信内接收相应的重要提醒。
请使用微信扫描二维码关注 “微信开放社区” 公众号
你这接口返回内容不止svg标签呀
可以将svg标签提取出来,转为base64数据,最终替换成<img src="src="data:image/svg+xml;base64,......." />
// strHtml为接口返回的html内容 initContent: function(strHtml) { var t = this, fs = wx.getFileSystemManager(), ps = [] t.svgTags = {} t.contentParts = strHtml.replace(/[\r\n\t]/g, '').split(/(<svg[^>]+>(?:(?!<\/svg>).)*<\/svg>)/g) for (var i in t.contentParts) { if (/<svg/.test(t.contentParts[i])) { t.svgTags[i] = { svg: t.contentParts[i], src: '', file: `${wx.env.USER_DATA_PATH}/svg_${i}` + '.svg' } ps.push((function (k, o, fs) { var file = o.svgTags[k].file return new Promise((rs, rj) => { fs.writeFile({ filePath: file, data: o.svgTags[k].svg, success(res) { o.svgTags[k].src = 'data:image/svg+xml;base64,' + fs.readFileSync(file, 'base64') rs(res) }, fail(res) { console.log(res) rj(res) } }) }) })(i, t, fs)) } } console.log(ps) ps.length && Promise.all(ps).then(res => { console.log(t.svgTags) for(var i in t.svgTags){ t.contentParts[i] = '<img style="width:100%;height:auto;border:0;" src="' + t.svgTags[i].src + '" />' } // 最后处理过的html内容 var ret = t.contentParts.join('') // this.setData({text:ret})可用rich-text显示 <rich-text nodes="{{text}}"></rich-text> console.log(ret) }).catch(e => { console.log(e) }) } ===================================== // 调用 strHtml = '接口返回的html' this.initContent(strHtml) ===================================== //this.setData({text:ret})可用rich-text显示 <rich-text nodes="{{text}}"></rich-text>
若认为该回答有用,给回答者点个[ 有用 ],让答案帮助更多的人
传回来的是什么?截个图看看
请学会如何「提问」(👈戳我)
请学会如何「提问」(👈戳我)
直接拿到svg的url使用 image组件来显示就可以了