基于java开发小程序接口,后台使用ueditor编辑图文内容。
小程序如何显示富文本内容呢?
一、直接传入html
nodes 属性推荐使用 Array 类型,由于组件会将 String 类型转换为 Array 类型,因而性能会有所下降
直接将html内容传入是可以,但是无论从性能还是显示样式来说都会有问题,所以不推荐这样做。
二、wxParse
网上现在较多的解决方法都是在小程序里引入wxParse插件来解决。
考虑到引入额外的插件会使得程序变大,所以就没有详细研究,有兴趣的可以自行百度。
三、解析成json
public class RichTextParse {
public static List<Object> parse(String body) throws DocumentException {
List<Object> nodes = new ArrayList<Object>();
Document doc = null;
doc = DocumentHelper.parseText("<xml>" + body + "</xml>"); // 将字符串转为XML
Element rootElt = doc.getRootElement(); // 获取根节点
List<Element> list = rootElt.elements();// 获取根节点下所有节点
for (Element element : list) { // 遍历节点
RichTextNode node = new RichTextNode();
node.setName(element.getName());
// attrs
for (Iterator it = element.attributeIterator(); it.hasNext();) {
Attribute attr = (Attribute) it.next();
node.getAttrs().put(attr.getName(), attr.getText());
}
// has children
if (!element.isTextOnly()) {
loopElement(node, element);
} else {
RichTextNodeText nodeText = new RichTextNodeText();
nodeText.setType("text");
nodeText.setText(element.getText());
node.getChildren().add(nodeText);
}
// add to nodes
nodes.add(node);
}
return nodes;
}
private static void loopElement(RichTextNode nodeParent, Element elementParent) {
List<Element> eles = elementParent.elements();
for (Element element : eles) {
RichTextNode node = new RichTextNode();
node.setName(element.getName());
// attrs
for (Iterator it = element.attributeIterator(); it.hasNext();) {
Attribute attr = (Attribute) it.next();
node.getAttrs().put(attr.getName(), attr.getText());
}
//
switch (element.getName()) {
case "img":
node.getAttrs().put("style", "max-width:100%;height:auto;");
break;
default:
break;
}
// has children
if (!element.isTextOnly()) {
loopElement(node, element);
} else {
RichTextNodeText nodeText = new RichTextNodeText();
nodeText.setType("text");
nodeText.setText(element.getText());
node.getChildren().add(nodeText);
}
// add to parent node
nodeParent.getChildren().add(node);
}
}
}
public class RichTextNode {
private String name;
private HashMap<String, String> attrs;
private List<Object> children;
public RichTextNode() {
super();
this.attrs = new HashMap<String, String>();
this.children = new ArrayList<Object>();
}
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public HashMap<String, String> getAttrs() {
return attrs;
}
public void setAttrs(HashMap<String, String> attrs) {
this.attrs = attrs;
}
public List<Object> getChildren() {
return children;
}
public void setChildren(List<Object> children) {
this.children = children;
}
}
public class RichTextNodeText {
private String type;
private String text;
public String getType() {
return type;
}
public void setType(String type) {
this.type = type;
}
public String getText() {
return text;
}
public void setText(String text) {
this.text = text;
}
}
这里测试了简单的图文编辑没有问题(html层级只有2层),暂未测试更复杂的多层嵌套的html(例如直接复制网页内容粘贴过来)。
后续发现将html当成简单xml来解析只能处理简单的内容,最后改成jsoup来解析
http://www.qizhan100.com/article_90.html
- 版权所有:奇站网络 转载请注明出处
- 厦门奇站网络科技有限公司,专业提供网站建设,响应式网站建设,小程序开发,系统定制开发。
- 软件开发咨询热线:吴小姐 13313868605