最近新公司接手新项目,信心满满的去了,没想到第一天就来了个滑铁卢。。。
新项目某个界面需要展示新闻内容,这个新闻内容本来应该是 .html ,但是又因为新闻标题、作者及发布时间等与 .html 有差别;所以后台就将 .html (body)内容打包成 json 返回:
![](https://img.haomeiwen.com/i1518579/94fe5de1423dff1e.png)
这看得我是一脸懵逼。。。
为了解决上述问题,正确展示内容,在查找一些资料以及咨询朋友后,采用了以下解决办法。如果哪位看官有更好、更简便的解决办法的话,请不吝赐教。。。
解决方法:
一、将后台返回的 json (body体)插入到字符串中,这个字符串要求采用前端开发工具(本人采用webStorm)创建 .html 文件,然后将该文件中的内容 copy 作为字符串:
![](https://img.haomeiwen.com/i1518579/493b4a4cb68f839f.png)
二、接下来,在 body 标签之间插入后台返回数据,并将该字符串整体写入沙盒(以 .html 结尾),最后将文件路径返回:
![](https://img.haomeiwen.com/i1518579/441b4c1a1b44ae5c.png)
三、最后在需要展示内容的地方,通过 webView 加载本地 .html 文件:
![](https://img.haomeiwen.com/i1518579/5e0cf2f15a600e0f.png)
以上,能够完美展示。。。
补充一:如果返回的 body 数据中含有图片标签的话,需要注意标签中的图片与屏幕适配的问题;以下方法来源于网络,可以解决图片适配问题:
![](https://img.haomeiwen.com/i1518579/3032a465a9fa6278.png)
该方法在 webView 的代理方法 -webViewDidFinishLoad: 中调用。。。
希望以上方法能解决你开发之痛
如有更好、更简洁方法,请不吝赐教。。。
补充二:如果该 webView 是作为 tableView 的 cell 的话,涉及到行高适配问题(网页加载完后需要刷新行高)
解决方法一:在 webView 的代理方法 -webViewDidFinishLoad: 中通过 js语句 计算行高后刷新 tableView :
![](https://img.haomeiwen.com/i1518579/121bf85539dc1fb7.png)
但是此方法有弊端:代理方法调用的时候,网页内容未必加载完成,最后导致行高计算错误,不能正确展示内容
解决方法二:监听 webView 的 scrollview 的 contentSize ,当 contentSize 变化的时候刷新 tableView 就能得到正确的行高:
![](https://img.haomeiwen.com/i1518579/671f554736220f96.png)
![](https://img.haomeiwen.com/i1518579/d72710cc86b36851.png)
最后记住:一定要移除观察者,不然程序会 crash
![](https://img.haomeiwen.com/i1518579/0c62809e5d61dac6.png)
以上,Enjoy。。。
网友评论