富文本——小程序中使用特殊符號及標簽

前言：

　　在小程序中輸出一段文字，其中的空格和回車會失效，今天就解決這個問題。

正文：

　　主要用<rich-text>組件

<rich-text :nodes="node" space="nbsp"></rich-text>

　　第一種使用方式：

//此為官方推薦，但是不能解決連續空格和回車問題
　　data() {
        return {
            node: [{        //最好是Array形式
                name: "div",    //1.此處為H5標簽名   2.不能加<>
                attrs: {        //屬性
                    style: 'display:block; line-height: 60px; color: red; text-align:center;'
                },
                children: [{    //子節點
                    type: 'text',
                    text: 'Hello&nbsp;uni-app!'
                },
                {
                    name: "br"
                },
                {
                    name: "img",
                    attrs: {
                        style: "width:50px; height:50px;",
                        src: "http://p3.qhimgs0.com/dr/280_200_60/t0111a9683741bad11d.jpg"
                    }
                }
                ]
            }]
        }
    },

　　第二種使用方式：

　　//此方式會影響效率，但是可以解決連續空格問題
　　data() {
        return {
            node: "Hello&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;uni-app!<br>Hello&nbsp;&nbsp;uni-app!",
        }
    }